在Highcharts（React Native）上触发click事件时，无法执行除“alert”之外的任何其他操作

Question

• 我在React Native中使用Highcharts
• 对于条形图，我定义了以下click事件：

  plotOptions: {
            series: {
                cursor: 'pointer',
                point: {
                    events: {
                        click: () => {
                          alert("Clicked!");
                        }
                    }
                }
            }
          }

• 我想在click事件上设置setState以显示被点击的栏的元素，但我甚至不能使用console.log（）。
• 我检查了一些示例，我看到的只是回调函数中的“警报”。

有任何想法吗？

谢谢！

Answer 1

它现在正在工作！问题是以下（据我所知）：

• React Native的Highcharts在WebView中呈现图表。因此，只能发出警报。
• 如果你直接尝试console.log（或调用一个方法或其他任何东西）它将无法工作，因为它没有到达React Native，它在webview中。
• 所以问题是：如何将数据从webview传递到React Native？答案是iiiiis ... window.postMessage（）

像这样：

1. 在config对象中（传递给图表）：

   plotOptions: {
         series: {
             point: {
                 events: {
                     click: function() {
                       window.postMessage( //data you want to send to react native )
                     }
                 }
             }
         }
       }

2. 将onMessage方法作为propView传递给ChartView，例如将其传递给WebView（https://facebook.github.io/react-native/docs/webview#onmessage） <ChartView style={{ height: 300 }} config={conf} onMessage={m => onMessage(m)} options={options}></ChartView>
3. 刚才你可以使用console.log，setState或者在本机onMessage函数中做任何事情

   onMessage = (m) => { 
      console.log(m.nativeEvent.data)
   }

就是这样，现在我可以单击一个栏并更改我的组件的状态;）