Tenho o seguinte conjunto de dados:
const dados = [5, 10, 15, 20, 25, 50, 90];
const colors = [
"#52DF9A",
"#FFCE1C",
"#3570BD",
"#3570BD",
"#00B894",
"#FB6B32",
];
E tenho o seguinte estado:
const [data, setData] = useState([{}]);
Preciso percorrer os dados e colocar um dado com uma respectiva cor, para que o estado "dado" fique da seguinte mandeiramaneira:
data = [
{ valor: 5, color: "#52DF9A" },
{ valor: 10, color: "#FFCE1C" },
// ...
]];
Fiz da seguinte maneira com useEffect useEffect
:
useEffect(() => {
dados.forEach((dado, i) => {
setData((prev) => {
return [...prev, { valor: dado, color: colors[i] }];
});
});
}, []);
Mas o problema é que, quando eu faço dessa forma, a primeira posição fica vazia:ocupada por um objeto vazio ({}
), e eu preciso que os dados comecem na primeira posição. Como eu posso resolver isso?
Porque
Porque se eu fizer assim:
const [data, setData] = useState([]);
ele da umDá erro.