在非React文件中访问React组件的状态

Question

我有一个主干文件，在其中，我使用React.renderComponent渲染一个React组件（计时器）。 但是，在react组件中，我有一个状态调用计数器。 我想从主干文件中获取该组件的状态。 尽管我将一个props.model传递给Timer，但可以确定地在Timer中修改此props，但这将使props.model中的数据得以保留，这是我不想做的。

由于Timer不是React组件的子代，因此我无法使用refs访问Timer.stat。 那么有没有办法在其父级中获取Timer的状态？

非常感谢！

Answer 1

不应从组件外部通过读取或拉取查询访问状态。 对于组件本身及其子组件来说，国家是私有的。

如果需要访问变量，则有两个选择：

• 使react组件在每次状态更改时发出一些更改事件，以通知其他人新的状态
• 在react组件之外跟踪它，并将其作为prop传递给组件本身。
• （肮脏的解决方案：不要在家中尝试） ：让react组件将特定的状态变量放入要呈现的HTML代码的数据属性中，例如<div data-foo={this.state.foo}>和然后从DOM中读取该属性。 在大多数情况下，如果状态发生变化，则react总是会重新渲染，因此您的媒体资源始终与状态保持同步。

如果其他所有方法都失败，则仅将最后一个选项用作转义符。 因为这违反了反应的设计原则。