如何从子组件react-dom中某个位置的react组件调用根html脚本中存在的功能？
root.html
<html>
<head>
<script type="text/javascript">
function NotifyWebView()
{
window.external.notify('Text');
}
</script>
</head>
<body>
<div id='root'></div>
</body>
</html>
index.tsx
componentDidMount{
//How to access and invoke NotifyWebView() ??
}
您可以将功能添加到窗口对象。
root.html
window.NotifyWebView = function () {
// ...your code
}
index.tsx
componentDidMount() {
window.NotifyWebView && window.NotifyWebView();
}
[我看到您正在使用Typescript，它将抱怨窗口对象中不存在属性“ NotifyWebView”。然后，您需要声明它。将其添加到index.tsx文件的末尾：
declare global {
interface Window {
NotifyWebView?(): void // Make it optional
}
}
在子组件中声明功能，如下所示
declare function NotifyWebView();
然后从子组件的任何方法调用函数
NotifyWebView();
您可以在单独的文件中创建函数，然后将该函数导入react组件，然后在组件中调用一个函数，例如单击按钮时，或者如果存在嵌套的组件，则可以作为道具传递。