为什么使用 react-chartjs-2 只更新了一张三张图表？

Question

原来我有一个模态，里面有一个记录数值的文本域。然后将记录的值通过循环传递，以使用文本字段中记录的数量填充排列。在此之后，值被发送到 3 个图表，以便您的数据得到更新。

出现的问题是只更新了最后一张图。我不知道发生了什么，因为似乎其他图形如果我们收到值，但不会更新它们。

我正在使用 material-ui 和 react-chartjs-2。

请能帮帮我的人。这里我将代码留在 StackBlitz 中，看看它是如何工作的。

Code in StackBlitz

Answer 1

我试了一下你的代码，似乎在 chart.js 文件中，你需要将你的 var chartReference 移动到你的主函数 ( function charts() ) 中，以便所有三个更新。

export default function charts(props) {
  var chartReference = {};
  useEffect (() => {
...

我的猜测是，当您的 chartReference 在函数之外时，它最终只会引用您的一个图表。