react-hooks/exhaustive-deps 用于 react chartjs 2 的图表数据答案

【问题标题】：react-hooks/exhaustive-deps for chart data of react chartjs 2react-hooks/exhaustive-deps 用于 react chartjs 2 的图表数据
【发布时间】：2021-02-18 05:02:19
【问题描述】：

我正在使用 react chartjs2 来显示折线图。并且图表的数据在useEffect中更新。图表显示数据。事情正在发挥作用。但我得到这个钩子排气部门规则警告：

第 51 行：React Hook useEffect 缺少依赖项：'chartData'。要么包含它，要么移除依赖数组 react-hooks/exhaustive-deps

但是，如果我添加状态图表数据，则页面会冻结，因为我认为它会进入无限循环。数据可能会不断调用。代码是：

const [chartData, setChartData] = useState({
    labels: [],
    datasets:[]
  });

  useEffect(()=>{
    let oNewChartData = {...chartData};
        oNewChartData.labels = [1,2,3,4,5,6,7];
        oNewChartData.datasets = [{
                       label: 'Week',
                       borderColor: 'green',
                       fill: false,
                       data: {x:[1,2,3,4,5,6,7],y:[0,1,2,3,4,5]}
                   }
                 ]
        setChartData(oNewChartData);
    }
  },[props]);

【问题讨论】：

标签： node.js react-redux react-chartjs-2

【解决方案1】：

是的，那是因为在更新chartData时会触发useEffect，而你在useEffect中更新了chartData，这会导致死循环。我的猜测是你有一个 ESLint 告诉你在你的 useEffect 中包含这个值。

ESLint 不知道 react 中的无限循环

【讨论】：