在react redux中同步查询参数和状态变量

Question

我对react-redux环境相当陌生。

对我的应用程序使用react样板。

我正试图找到正确的方法，将一些redux状态变量与查询参数同步，以便与其他人共享链接。

进行了redux查询同步，但不再进行维护。

我想与URL查询参数同步的是搜索查询字符串和过滤器。

请提出一个在我使用的样板中实现这一点的好方法。

-感谢

Answer 1

由于没有库可以做到这一点，我想我自己的方式希望这能帮助到别人。这不是最有效的方法，所以请随意向我推荐一个更好的方法。

步骤1: 捕捉状态变化：

---

为此，所有相关组件都应该在一个单独的容器中，并使用捕捉状态变化

componentDidUpdate(prevProps, prevState, snapshot) {
if (JSON.stringify(prevProps.search.queryString) !== JSON.stringify(this.props.search.queryString)){
// make sure to use escape to build the queryParams variable
this.props.history.push(queryParams, null);
}
}

步骤2：获取reducer.js中刷新页面时的状态(如果有(

---

使用类似查询字符串的好解析器

import queryString from 'query-string';
const params = queryString.parse(history.location.search);

步骤3：在componentDidMount上加载所需的状态变量

---

安装组件时，需要将一些状态变量加载到状态中，在这种情况下(如果您正在使用一个(，可以使用componentDidMount