胜利事件未重新呈现图表

问题描述

我在项目中使用Victory进行数据可视化。但是，在我的图表中实现事件处理程序时，我注意到，尽管它们更改了目标属性，但是这些图表从不重新呈现，因此没有任何变化。

下面是Victory documentation的示例，该示例在我的计算机上不起作用：

<div>
  <h3>Click Me</h3>
  <VictoryScatter
    style={{ data: { fill: "#c43a31" } }}
    size={9}
    labels={() => null}
    events={[{
      target: "data",eventHandlers: {
        onClick: () => {
          return [
            {
              target: "data",mutation: (props) => {
                const fill = props.style && props.style.fill;
                return fill === "black" ? null : { style: { fill: "black" } };
              }
            },{
              target: "labels",mutation: (props) => {
                return props.text === "clicked" ?
                  null : { text: "clicked" };
              }
            }
          ];
        }
      }
    }]}
    data={[{ x: 1,y: 2 },{ x: 2,y: 3 },{ x: 3,y: 5 },{ x: 4,y: 4 },{ x: 5,y: 7 }]}
  />
</div>

经过一些调试后，我可以确认由于data事件而导致组件的labels和onClick属性发生了变化，但是这些变化实际上并没有反映在图表。有解决方案吗？

解决方法

问题似乎是由于<React.StrictMode>中的代码中包含index.js引起的。删除它可以解决问题。我不确定为什么为什么！