React/Flux/React-Router：重新路由时如何调用存储数据？

Question

工具：React 0.14.0、Vanilla Flux 和 React-Router

在 IndexRoute 之外重新路由时遇到问题。 -我不知道如何为下一个组件调用存储数据。

例如：一个简单的路由

<Route path="/" component={Main}>
    <IndexRoute component={Component1} />
    <Route path="newPath" component={Component2} />
</Route>

Component1(The IndexRoute) 和 Component2 使用相同的存储数据并初始化相同的数据

function getInitialState() {
    return {
      object1: null,
      object2: null,
      object3: null
   }
}

它们的更新方式相同：

function getStateFromStores() {
    return {
      object1: Store1.get(),
      object2: Store2.get(),
      object3: Store3.get(),
    }
}

问题：

但 IndexRoute 肯定会调用 getStateFromStores()，因为它会监听初始加载到存储中，但 Component2 在路由到时仍然为空。

我的不太确定的解决方案

如果我将存储设置为在它们为空时返回“null”，我可以通过设置更改它的初始化来使 Component2 使用其数据呈现​​：

function getInitialState() {
    return {
        object1: Store1.get(),
        object2: Store2.get(),
        object3: Store3.get()
    }
}

我担心我的解决方案可能更像是一个 hack，而不是一个解决方案，并且可能有一个常见的组件生命周期和/或 React-Router 技术来加载组件

Answer 1

您应该在 componentWillMount 而不是您的组件构造函数中执行此操作。该生命周期事件将使您有时间在组件安装到 DOM 之前预先填充本地状态。