react、react-router 和异步数据加载
react, react-router, and async data loading
我正在使用 React、alt.js 和 React-router，并使用基本的 CRUD 构建应用程序。 "Create Item" 有一个菜单项，它会调出一个模式（使用 react-bootstrap...）并在提交时触发一个动作以在后端创建一些模型，然后执行一个browserHistory.push（按照 react-router 文档中的建议）完成后转到新创建项目的项目页面。
所以在基本情况下，这是可行的。例如，如果我在主应用程序页面上，它就可以工作。但是，如果我已经在另一个项目的项目详细信息页面上（假设我在 /item/1 上并且我刚刚创建了 /item/2，那么我正在尝试重定向到 /item/2 从页 /item/1)。
我的异步加载逻辑（嗯，至少是 fetchItem 的动作调用）在 ItemViewPage 反应组件的 componentDidMount 中，这看起来非常典型我可以在网上找到的例子。
问题是，如果页面当前已经呈现，componentDidMount 永远不会被调用，因为组件已经安装（！）。所以我的页面 URL 更新为 /item/2，但内容仍然是 /item/1。
所以，我的问题是......是的。我从 componentDidMount 启动数据加载是错误的吗？我是否应该使用其他生命周期方法（例如，componentWillReceiveProps，因为 React 路由器将设置一个新 ID）？或者是否有其他完全应该从中触发数据加载的地方（例如，react-router 是否有一些我不知道的功能可以处理这个问题）？
由于 React 很聪明并且知道您在路由中重新使用该组件，因此该组件将保持挂载状态。您选择的生命周期方法将无法处理这项工作，因为它会在组件的初始安装时被调用一次。
我建议您使用 componentWillReceiveProps，您可以在其中检查您项目的 id 字段是否已更改。这意味着您可能应该更新，因为有新的、不同的数据要呈现。
我正在使用 React、alt.js 和 React-router，并使用基本的 CRUD 构建应用程序。 "Create Item" 有一个菜单项，它会调出一个模式（使用 react-bootstrap...）并在提交时触发一个动作以在后端创建一些模型，然后执行一个browserHistory.push（按照 react-router 文档中的建议）完成后转到新创建项目的项目页面。
所以在基本情况下，这是可行的。例如，如果我在主应用程序页面上，它就可以工作。但是，如果我已经在另一个项目的项目详细信息页面上（假设我在 /item/1 上并且我刚刚创建了 /item/2，那么我正在尝试重定向到 /item/2 从页 /item/1)。
我的异步加载逻辑（嗯，至少是 fetchItem 的动作调用）在 ItemViewPage 反应组件的 componentDidMount 中，这看起来非常典型我可以在网上找到的例子。
问题是，如果页面当前已经呈现，componentDidMount 永远不会被调用，因为组件已经安装（！）。所以我的页面 URL 更新为 /item/2，但内容仍然是 /item/1。
所以，我的问题是......是的。我从 componentDidMount 启动数据加载是错误的吗？我是否应该使用其他生命周期方法（例如，componentWillReceiveProps，因为 React 路由器将设置一个新 ID）？或者是否有其他完全应该从中触发数据加载的地方（例如，react-router 是否有一些我不知道的功能可以处理这个问题）？
由于 React 很聪明并且知道您在路由中重新使用该组件，因此该组件将保持挂载状态。您选择的生命周期方法将无法处理这项工作，因为它会在组件的初始安装时被调用一次。
我建议您使用 componentWillReceiveProps，您可以在其中检查您项目的 id 字段是否已更改。这意味着您可能应该更新，因为有新的、不同的数据要呈现。