Question

我有一个反应应用

我需要chart.js将 arcsData 更改为来自App.js的数据＆gt;矩形数据，onClick函数（App.js＆gt; 286）给出数据（data: {name: "XXXXXXXXXXXXX", DateRange: "January 2002 - April 2002", Duration: 0.3333333333332333}）。

在App.js矩形展示name: value 我需要{strong}矩形数据 char.js显示DateRange: value。

要查看它，请单击蓝色圆圈＆gt;经验＆gt;然后打开7个矩形＆gt;点击矩形时会出现图表。

每次单击一个矩形时，它都会获得新数据（可以在控制台上看到）。

感谢。

Answer 1

此代码框中的更新https://codesandbox.io/s/ymp6rrl199

您可以看到我使用状态来呈现包含selectedRectangle dateRange值的图表：

<div id="chart">
     {this.state.selectedRectangle && (
         <Chart dateRange={this.state.selectedRectangle.DateRange} />
     )}
</div>

状态在矩形上更新onClick :( App.js：297）

onClick={() => {
  this.setState({
    selectedRectangle: node.data
  });
}}

然后使用以下内容访问chart.js中的dateRange

this.props.dateRange

请使用这样的状态而不是你所做的所有forceUpdate()，你永远不应该使用它。

如何将数据作为其他文件中的道具？

1 个答案: