听商店 vs forceUpdate()

Question

如果我在一个页面上有五个组件，它们可以从商店中获取一些东西。他们都在听一家商店。对于所有组件，我在商店中创建侦听器。

我的问题是 - 我可以使用 forceUpdate() 代替监听器吗？在商店发送东西并等待更新：

getInitialState: function() {
   return {val: Store.getFoo};
},
click: function(info) {
  Store.updateInfo(info, function() {
   this.forceUpdate();
  })
}

店内：

updateInfo: function(info, callback) {
   foo = info + someValue;
   callback()
}

但是在文档中：

Normally you should try to avoid all uses of forceUpdate() and only read from this.props and this.state in render(). This makes your application much simpler and more efficient

谢谢。

Answer 1

您可以使用forceUpdate，但不应该。

您当前的做法是正确的（未使用 forceUpdate）。

如果您有这 5 个组件的共同父级监听更改并将数据向下传递给子级，则父级代码会变得臃肿，并且当商店更改时您将呈现 6 个组件（父级、5 个子级）。让更多 "container" 组件监听商店会在组件之间创建更多隔离 ("independent children") 并且性能更高，因为当商店更新时，更少的组件会重新渲染。确保你也使用了 shouldComponentUpdate。

如果您想了解有关 "independent children" 和更高性能 React 的更多信息，请观看：https://www.youtube.com/watch?v=KYzlpRvWZ6c

听商店 vs forceUpdate()

listening a store vs forceUpdate()

flux

reactjs