ReactJS 状态变化不会同时反映在不同的会话中

Question

我正在使用 ReactJS、Typescript 和 Firebase 构建一个 Web 应用程序，其中一个用户将能够监视更改以及与另一个用户的 UI 的交互。两个用户可以同时看到相同的视图并显示一些图像。例如，User1点击的任何图片都会改变它的边框，这应该反映在User2的UI中。 这仅使用 DOM、typescript 和 firebase 是可行的，但使用 ReactJS 我面临很多困难。

第一个问题： 是否可以在不使用 state 或 props 的情况下更新 ReactJS 中已经创建和显示的组件？

从我目前看到的情况来看，我认为这是不可能的。所以，

第二个问题： 我试图单独使用状态来实现我所解释的，但似乎每当 User1 例如更改状态时，显示给 User1 的组件都会单独重新渲染，而 User2 的组件无法捕获状态的变化重新渲染。两个组件是相同的。 我正在使用 Chrome 和 Firefox 与 2 个用户一起运行该应用程序。有没有办法单独使用状态和道具来实现这一点？

我是这方面的初学者。任何帮助将不胜感激。

Answer 1

如果您使用 redux 之类的东西集中状态管理，则应用程序状态应该可以表示为单个对象。然后，您应该能够向应用程序添加一些 redux middleware 以将任何状态更改推送到 Firebase，然后从 Firebase 读回所有更改并将它们推送到您的商店（通过行动）。

如果您确实更喜欢更新组件而不更改 props，则可以使用 forceUpdate method。