reactjs - ReactDOM 的新 Root API 使用 createRoot() 而不是 render()

我收到一个控制台警告,提示已弃用渲染并运行 React 17 而不是 React 18。此外,redux 已弃用 createStore 以支持 configureStore。我将如何实现新的 createRoot 和 configureStore?

const store = createStore(reducers, compose(applyMiddleware(thunk)));

ReactDOM.render(
    <Provider store={store}>
    <App />
    </Provider>,
    document.getElementById('root')
);

回答1

根据我们在 https://redux.js.org/tutorials/fundamentals/part-8-modern-redux#store-setup 上的文档,您的 createStore 调用可以替换为:

const store = configureStore({
  reducer: reducers,
})

(是的,就是这样!它为您完成了 composeapplyMiddleware(thunk) 步骤。)

请注意,reducers 变量也可以通过将这些切片缩减器直接传递给 configureStore 来跳过:

const store = configureStore({
  reducer: {
    users: usersReducer,
    posts: postsReducer,
    // etc

  }
})

对于 createRoot,根据 https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-client-rendering-apis ,切换到:

const reactRoot = createRoot(document.getElementById('root'));

reactRoot.render(
  <Provider store={store}>
    <App />
  </Provider>
)

相似文章

centos7 - Nmap 脚本 ssl-dh-params tls.lua 执行时出错

我正在使用Nmap来验证我们的一些服务器设置,以确保我们符合要求。在扫描中弹出但在之前的任何其他扫描中都没有出现的一件事是我们的key交换大小问题。我们允许1028并且要符合要求,它需要限制为2048...