从JavaScript调用React组件的函数

5

我有一个问题,因为我不确定是否可能。我有一个包含一些JavaScript函数的ReactJS项目。

我找到了一个解决方案来使用window对象从React组件中调用JavaScript函数,但是能否在JavaScript脚本中从React组件中调用函数呢?

例如,我在React组件中定义了一个函数。能否在JavaScript中调用该函数?

谢谢。


你需要从一个函数中调用React组件的原因是什么?你能提供使用案例吗?因为这种模式似乎不正确,可能有更好的模式适用于该使用案例。 - Kenneth Truong
删除方法在React组件中。我正在处理JavaScript函数中的点击事件,需要从React组件调用该删除方法。 - Devmasta
你在 JavaScript 中是什么意思?你是指 Node 吗?这听起来不像是一个好的做法。 - squeekyDave
1
你能提供示例代码吗?这样可以为使用案例提供上下文,使其更容易理解。 - Kenneth Truong
1个回答

7

一个旨在在 React 应用程序包之外使用的函数,应该暴露到全局范围:

window.foo = () => { /* ... */ };

然后,可以通过以下方式访问它:
<script src="react-app-bundle.js"></script>
<script>
foo();
</script>

如果React应用程序包被发布为UMD模块,它可以在入口点导出函数。
export const foo = () => { /* ... */ };

当通过<script>加载时,其命名空间将暴露到全局作用域:
<script src="react-app-bundle.js"></script>
<script>
ReactAppNamespace.foo();
</script>

这种情况在许多第三方React库中很常见,React本身公开了全局变量React

最好将所有依赖于React应用程序内部的代码放置在应用程序本身中,从而不需要访问全局变量。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接