Question

我正在开发一个现有的SPA，我们将反应组件绑定到页面上的特定元素。使用react-redux时，我们使用Provider组件使存储可用于连接的组件。

但是，如果您多次调用ReactDOM.render，则连接的组件不会取消订阅商店，并且会创建提供商的重复实例，而不是仅仅更新现有组件。

export const init = (Component) => {
    ReactDOM.render(
        <Provider store={store}>
            {Component}
        </Provider>,
        ocument.getElementById('app')
    )
}

然后，由于与现有SPA集成，因此在react，redux或react-router之外调用init。

init(Component1)
init(Component2)
init(Component1)

React dev工具然后显示提到的提供者的重复实例。

<Provider store={store} />
<Provider store={store} />
<Provider store={store} />

我查看了其他可用的ReactDOM方法，可能会删除任何现有的绑定到DOM元素，但这没有帮助，例如[unmountcomponentatnode] [https://facebook.github.io/react/docs/react-dom.html#unmountcomponentatnode]

react-redux ReactDOM.render重复<provider>实例

0 个答案: