React：触发根组件外的事件或值

Question

有人可以帮我这个想法吗？ 我不知道是否有可能或者我应该使用任何图书馆或技能。

组件（这通常很常见）

import React, { useState } from "react";

export default function App() {
  const [anyVal, setAnyVal] = useState(0);

  return (
    <div className="App">
      <h1>Any Value: {anyVal}</h1>
      <button onClick={() => setAnyVal(anyVal + 1)}>Change value</button>
    </div>
  );
}

连接 HTML + React Dom（这很常见）

import { StrictMode } from "react";
import ReactDOM from "react-dom";

import App from "./App";

const rootElement = document.getElementById("root");
ReactDOM.render(
  <StrictMode>
    <App />
  </StrictMode>,
  rootElement
);

这是我不知道是否可能的部分

  <body>
    <div id="root" onanyvaluechanged="externalFn(v)"></div>
    <script>
      function externalFn(newValue) {
        alert("I've detected the change:" + newValue);
      }
    </script>
  </body>

Answer 1

如果您在这样的脚本标记中声明 function，它存在于全局 window scope 中，因此您可以从您的 React 组件中这样调用它：

window.externalFn('any value')

React：触发根组件外的事件或值

问题描述

1 个解决方案

解决方案1
0 2022-02-10 00:09:26

React：触发根组件外的事件或值

问题描述

1 个解决方案

解决方案1 0 2022-02-10 00:09:26

解决方案1
0 2022-02-10 00:09:26