在React.js webview和本机代码之间进行通信？

Question

我这里不是在谈论react-native。

这是一款带有原生和javascript的混合应用 我们使用的Javascript库恰好是React.js。

我们在类似的设置中使用了Backbone，我们在native和js world之间传递消息没有任何问题。

对于与js交谈的本机端，我们在页面中公开了一个全局变量（一个Backbone View实例）。

所以我们可以做window.login_view.do_login()。

之类的事情

这是可能的，因为我们有login_view个实例。

但是对于react.js，我不知道如何创建这样的实例，因为我的代码看起来像下面的内容，并且没有instance我可以参考

 ReactDOM.render(
   <Provider store={store}>
     <Router>
       <Article/>
     </Router>
   </Provider>,
   document.getElementById('mainApp')
 )

原生方如何与混合应用中的react.js对话？

Answer 1

使用ref：

...
<Article ref={(article) => { this._article = article; }} />
...

在您的文章课程中：

componentDidMount: function() {
    window.globaVarArticle = this._article;
} ...

现在您可以使用window.globaVarArticle访问类Provider的方法。[methodname]