Chartjs-How to wait for data in useEffect hook before displaying it?

by

0👍

Try this:

useEffect(() => {
  const fetchData = async () => {
     const res = await axios.get(
      "http://192.168.10.88:3000/test/memory?intervalo=1h&servidor=192.168.2.138&filtro=-1h"
    );
     return res;
  }
  const getData = async () => {
    let res = await fetchData();
    const gbMaximo = Number(res.data.total / 1000 / 1000 / 1000);
    setMaximo(gbMaximo);
    let ejex = [];
    let valores = [];
    res.data.valores.map((valor) => {
      const tiempoFormateado = new Date(valor.time).toLocaleTimeString();
      ejex.push(tiempoFormateado);
      const gb = Number(valor.value) / 1000 / 1000 / 1000;
      const gbFinal = gb.toFixed(2);
      valores.push(gbFinal);
  });
  setLabels(ejex);
  setDatasets(valores);
  };

  getData()
}, []);

And sure, you can define the functions outside the useEffect

Leave a comment