反应路由和恢复状态
React Routing and Restoring State
我可以使用一些关于 React、Redux 和路由的建议。我一直在玩 react-router-redux 和 redux-little-router。两者似乎都没有提供用于恢复路由状态的开箱即用的解决方案。我来解释一下:
假设我有一个有产品页面的应用程序。产品页面显示相关产品。用户可以单击相关产品并查看其产品页面。他们可以从该产品页面点击其他相关产品等。
我最终得到的是一堆页面被推送到路由 "stack",所有页面都具有相同的路径。当用户点击返回时,我需要遍历产品页面,每个页面都恢复了适当的状态。
我的问题是:我在哪里存储每个产品页面的状态位。我看不到主要框架如何为此提供机制。我必须自己写吗?
您不应尝试存储任何堆栈/历史记录。您应该在 URL 中存储显示页面所需的数据,例如产品 ID。在您的路线或组件中,您应该从 AJAX 加载适当的数据并根据 URL.
的 ID 进行存储
您可以在onEnter
callback:
中获取数据
或者您可以使用像 async-props or redux-async-connect 这样的库来获取数据,当您的组件挂载以响应路由更改时将调用这些数据。
我可以使用一些关于 React、Redux 和路由的建议。我一直在玩 react-router-redux 和 redux-little-router。两者似乎都没有提供用于恢复路由状态的开箱即用的解决方案。我来解释一下:
假设我有一个有产品页面的应用程序。产品页面显示相关产品。用户可以单击相关产品并查看其产品页面。他们可以从该产品页面点击其他相关产品等。
我最终得到的是一堆页面被推送到路由 "stack",所有页面都具有相同的路径。当用户点击返回时,我需要遍历产品页面,每个页面都恢复了适当的状态。
我的问题是:我在哪里存储每个产品页面的状态位。我看不到主要框架如何为此提供机制。我必须自己写吗?
您不应尝试存储任何堆栈/历史记录。您应该在 URL 中存储显示页面所需的数据,例如产品 ID。在您的路线或组件中,您应该从 AJAX 加载适当的数据并根据 URL.
的 ID 进行存储您可以在onEnter
callback:
或者您可以使用像 async-props or redux-async-connect 这样的库来获取数据,当您的组件挂载以响应路由更改时将调用这些数据。