React：尝试使用本地 JSON 数据通过 useEffect 设置状态

Question

我有一个功能组件，它使用 useState 设置 mtvData 状态（通过 setMtvData）。

但是，我正在尝试在 useEffect 中调用 setMtvData，以便 mtvData 状态将具有 json 数据和 json 数据将传递给 Chart 组件。

但到目前为止，图表组件只是得到一个空字符串：

import Chart from './Chart.js';
import {useState, useEffect} from 'react';
import myjson from './data/myjson.json'

export default function App() {

  const [mtvData, setMtvData] = useState([]);

  useEffect(() => {
    setMtvData([...myjson]);
  },[])

  return (
     <Chart data={mtvData} />
  )

}

Answer 1

为什么要在装载时设置状态而不是用 json 初始化状态？

import Chart from './Chart.js';
import {useState, useEffect} from 'react';
import myjson from './data/myjson.json'

export default function App() {

  const [mtvData, setMtvData] = useState([...myjson]);

  return (
     <Chart data={mtvData} />
  )

}

React：尝试使用本地 JSON 数据通过 useEffect 设置状态

React: Trying to set state via useEffect using local JSON data

javascript

reactjs

use-effect

use-state