如何全局访问 App() 的属性（在 React App 中，来自 pyodide）答案

【问题标题】：How to access a property of App() globally (in React App, from pyodide)如何全局访问 App() 的属性（在 React App 中，来自 pyodide）
【发布时间】：2021-02-26 09:02:00
【问题描述】：

我已经在 React App like so 中实现了 pyodide。

在上面链接示例中的src/App.js 中，假设我想从script.py 访问App() 中的someProperty。

const App = () => {
  const [output, setOutput] = useState("(loading...)");
  const [someProperty, setSomeProperty] = useState("Initial state");  // this one
  const runScript = code => {
    window.pyodide.loadPackage([]).then(() => {
  ...

在pyodide的正常情况下，我会使用import js从pythonlike in the docs访问javascript范围。

可以使用 js 模块从 Python 访问 JavaScript 范围（请参阅Using Javascript objects from Python）。这个模块代表全局对象窗口，它允许我们直接操作 DOM 并从 Python 访问全局变量和函数。

但是，该属性位于App() 内部，而不是直接位于window 之下。

如何从script.py 访问App() 内部的someProperty？

换句话说，App() 位于window 属性下的哪个位置？甚至可以全局访问App() 的属性吗？

【问题讨论】：

标签： reactjs pyodide

【解决方案1】：

您应该能够创建一个可以访问这些局部变量的 JS 对象

let my_module = {
  someProperty : function(){
    return someProperty;
  }
};

然后您可以注册为 Python 模块，

pyodide.registerJsModule("my_js_module", my_module);

这样它就可以导入为，

from my_js_module import someProperty

请参阅documentation for more details。这仅适用于 pyodide 的开发版本或即将发布的 0.17.0 版本。

【讨论】：