打印参考对象但尝试访问 state.chart 时，AmChart 参考属性“图表”不为空。图表“图表”属性变为空？答案

【问题标题】：AmChart reference attribute 'chart' not null when printing reference object but when trying to access state.chart the 'chart' attribute becomes null?打印参考对象但尝试访问 state.chart 时，AmChart 参考属性“图表”不为空。图表“图表”属性变为空？
【发布时间】：2017-10-21 06:23:47
【问题描述】：

我这样引用 AmChart：

ref={(e) => {if (e) {this.ch = e}}}

当我在componentDidMount 中打印this.ch 时，我可以看到属性state 存在并且chart 属性不为空。但是，当我尝试访问 this.ch.state.chart 时，它为空。当我在打印this.ch 的上一个控制台日志之后立即打印this.ch.state 时，chart 属性为空。为什么这个属性只有在我尝试访问它时才为空，而在我打印this.ch时却不是？

编辑：

【问题讨论】：

你在哪里做console.logs？发布该代码，以便我们可以看到问题。根据您发布的内容，我不知道会发生什么。
你在说什么？ state 不会存在于参考文献中。 ref 是一个 DOM 元素。
控制台日志在 componentDidMount 中。 console.log(this.ch) 将 state.chart 显示为 NOT null，而 console.log(this.ch.state) 将 chart 显示为 null。使用更新的屏幕截图查看问题。
您的第一个 console.log 是整个组件，而不是您的参考。不知道第二个是什么。为什么不使用this.state？你想用 refs 做什么？你可以发布你的渲染方法吗？你在哪里添加参考？
好的，第一个：console.log(this.ch)，第二个：console.log(this.ch.state)。而已。一个说 state->chart 为空，另一个说它不是。它们是相同的this.ch。 ref 再次添加到 ref={(e) => {if (e) {this.ch = e}}} 下的渲染中的 AmChart 标记中。我正在尝试在图表上调用 zoomToIndexes，但我无法使用 null chart 属性来执行此操作。

标签： reactjs amcharts

【解决方案1】：

无论上述方法是否是访问chart 的正确方法，您都可以使用 AmCharts 上的事件侦听器来访问图表并进行更改。在 AmChart 元素标签中的“选项”下，添加一个监听器：

   "listeners": [{
            "event": "rendered",
            "method": (e)=>{e.chart.doSomething()};
            }
    }]

【讨论】：