如何使用mobx正确地使react-refresh自动更新组件？

编程问答 2022-06-07

问题描述

首先，我想知道react-refresh是否应该与Mobx之类的数据存储解决方案一起正常工作？

我注意到我的某些组件正确更新，而另一些则没有。 我试图找出原因。我使用react-refresh-webpack-plugin

编辑1： 似乎不会更新的组件是使用带有观察者的mobx反应注射的组件，例如：inject('rootStore')(observer(MyComponent))

我确实获得了更新的控制台日志：

[HMR] bundle rebuilding
client.js?9cea:250 [HMR] bundle rebuilt in 530ms
process-update.js?e135:51 [HMR] Checking for updates on the server...
process-update.js?e135:125 [HMR] Updated modules:
process-update.js?e135:127 [HMR]  - ./src/application/App/Private/UserProfile/UserProfile.js
process-update.js?e135:132 [HMR] App is up to date.

但是页面上没有更新。

我的库版本：

  • 反应：16.13.1
  • mobx：6.0.1
  • mobx反应：7.0.0
  • webpack：4.44.2
  • webpack-dev-middleware：3.7.2
  • webpack-hot-middleware：2.25.0
  • @ pmmmwh / react-refresh-webpack-plugin：0.4.2

上下文：

  • 我正在从react-hot-loader v3更新。
  • 我永远无法使ROL v4在mobx上正常工作，出现同样的问题（某些组件会更新，有些则不会）

由于不再维护ROL v3，我将切换到react-refresh，并且将与较新的React版本不兼容。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

hot-reloadmobxmobxmobxmobxreactjsreactjsreactjsreactjswebpackwebpackwebpack