从外部 JavaScript 函数调用 react 组件的函数

Question

我正在尝试从 javascript 函数调用 react 组件的函数。在初始阶段，我想调用在 react 组件中声明的函数，而不是从 react 调用，我需要从 javascript 函数调用它。

我知道如何从 react 函数调用 javascript 函数。像下面

Javascript

<script type="text/javascript">
  function test(){
    alert('Function from index.html');
  }
</script>

反应

componentWillMount() {
  window.test();
}

但就我而言，我想要一个完全相反的过程，由于某些插件初始化需要从 javascript 调用 react 函数。

我浏览了其他相关主题，但没有得到确切答案。那么我该怎么做呢？

Answer 1

您可以将函数window作为函数分配给对象，并从脚本中调用它。所以基本上你会做以下事情：

componentWillMount() {
  window.reactFunction = () => {
    console.log('Test');
  }
}

然后从您的脚本中调用它，如下所示：

<script type="text/javascript">
  function test(){
    window.reactFunction()
  }
</script>

诚然，我不知道您打算如何使用它，但这可能是通过利用全局window对象来完成您想要的一种方式。第二部分实际上需要某种方式来确定反应组件是否已安装（在一个非平凡的例子中），或者只是在调用之前检查该方法是否存在。