How to seperate keys and values from a json and store it in a array using useState hook in react

Question

function Graph() {
  const [tcases, setCases] = useState([]);
  const [recovered, setRecovered] = useState([]);
  const [deaths, setDeaths] = useState([]);
  useEffect(() => {
    axios
      .get("https://disease.sh/v3/covid-19/historical/all?lastdays=all")
      .then((res) => {
        setCases(Object.values(res.data.cases));
        setRecovered(Object.values(res.data.recovered)));
        setDeaths(Object.values(res.data.deaths)));
      })
      .catch((err) => {
        console.log(err);
      });
  }, []);

I have tried the above code..it says cases,recovered and deaths are undefined

API used: click here to see the api I want it like this..Please help: :)

   tcases=[555,654,941...........]

   recovered=[17,18,26.........]

    deaths=[28,30,36...........]

Thank you!

Answer 1

function Graph() {
  const [tcases, setCases] = useState([]);
  const [recovered, setRecovered] = useState([]);
  const [deaths, setDeaths] = useState([]);
  const [date, setDate] = useState([]);
  useEffect(() => {
    axios
      .get("https://disease.sh/v3/covid-19/historical/all?lastdays=all")
      .then(res => {
        setCases(JSON.parse(JSON.stringify(Object.values(res.data.cases))));
        setDeaths(JSON.parse(JSON.stringify(Object.values(res.data.deaths))));
        setRecovered(JSON.parse(JSON.stringify(Object.values(res.data.recovered))));
        
      })
      .catch(err => {
        console.log(err);
      });
  }, []);

JSON.stringify returns a string..Inorder to store it in array format we will have to use JSON.parse which returns an object.