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

IT技术 javascript reactjs
2021-05-21 20:51:24

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

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

Javascript

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

react

componentWillMount() {
  window.test();
}

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

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

1个回答

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

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

然后从您的脚本中调用它,如下所示:

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

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