如何同步Redux状态和URL哈希标签参数
我们有一个讲座和章节的列表，用户可以select和取消select它们。 这两个列表存储在一个还原存储中。 现在我们想要在url的哈希标记中保留选定的演讲片段和章节片段的表示，并且对url的任何更改也会改变存储（双向同步）。
使用react-router甚至react-router-redux最好的解决scheme是什么？
我们无法find一些很好的例子，其中反应路由器仅用于维护URL的哈希标记，也仅更新一个组件。
谢谢！！！
我想你不需要。
（对不起，我的经验是最好的解决scheme。）
商店是您的数据真相的来源。 这可以。
如果您使用React路由器，让它成为您的URL状态的真相的来源。
你不必把所有东西都放在商店里。
例如，考虑你的用例：
因为url参数只包含讲座的段落和被select的章节。 在商店中，我有一个名字，slu and和选定布尔值的讲座和章节列表。
问题是你正在复制数据。 商店中的数据（ chapter.selected ）在React Router状态中被复制。 一种解决scheme是同步它们，但这很快变得复杂。 为什么不让React Router成为选定章节的真相之源呢？
您的商店状态将看起来像（简化）：
{ // Might be paginated, kept inside a "book", etc: visibleChapterSlugs: ['intro', 'wow', 'ending'], // A simple ID dictionary: chaptersBySlug: { 'intro': { slug: 'intro', title: 'Introduction' }, 'wow': { slug: 'wow', title: 'All the things' }, 'ending': { slug: 'ending', title: 'The End!' } } }
而已！ 不要在那里存储selected 。 让React Router处理它。 在你的路由处理程序中写入类似的东西
function ChapterList({ chapters }) { return ( <div> {chapters.map(chapter => <Chapter chapter={chapter} key={chapter.slug} />)} </div> ) } const mapStateToProps = (state, ownProps) => { // Use props injected by React Router: const selectedSlugs = ownProps.params.selectedSlugs.split(';') // Use both state and this information to generate final props: const chapters = state.visibleChapterSlugs.map(slug => { return Object.assign({ isSelected: selectedSlugs.indexOf(slug) > -1, }, state.chaptersBySlug[slug]) }) return { chapters } } export default connect(mapStateToProps)(ChapterList)
react-router-redux可以帮助你注入url的东西来存储，所以每次散列标签改变，存储也。
