渲染react组件后如何执行js文件？

Question

我有4个反应组件标题，模态，容器，索引。在index.js中，我渲染了所有组件。现在，我有一个问题我的HTMl页面正在使用一个js文件（home.js）。它在DOM加载之前执行。因此，它没有获得DOM的任何属性，因此它失败了。那么，一旦加载DOM，我怎样才能执行js文件？

Answer 1

使用全局函数包装home.js代码，并在根React组件的componentDidMount生命周期方法中调用该函数。

所以你的home.js文件看起来像这样。

window.executeHome = function() {
  // your curren home.js code goes here
}

并在根React组件的componentDidMount方法内，您可以调用上面的方法，以确保在加载React组件后运行home.js代码。

componentDidMount() {
  window.executeHome();
}

但是，请将此视为一种解决方法，通常不建议这样做。更好的方法是在React组件中编写home.js代码。

Answer 2

请尝试

while True:
    event, values = window.read()

    if event == 'checkbox_key':
        toggle_bool1 = not toggle_bool1
        window['section_key'].update(visible=toggle_bool1)
    
    ...

    if event == 'Quit' or event == sg.WIN_CLOSED:
        break

componentDidMount（）在render（）方法之后自动调用。