Question

我正在将应用程序状态的一部分从商店移动到URL。

我目前正在使用redux管理我的应用程序状态以及reselect来创建选择器。选择器根据redux存储中的状态计算派生值（原则上，这是它们唯一的输入）。

现在状态的一部分将包含在URL中，所以我不确定如何阅读它。

我看过react-router-redux，乍一看似乎是解决方案（事实上，我可以使用state.routing.locationBeforeTransitions.query获得我想要的价值）但这似乎并不是是正确的做法，因为在他们的文档中它说：

您不应直接从Redux商店读取位置状态。

我是否有其他方式可以访问我的位置状态，或者我应该忽略此警告并在我的选择器中使用它？

Answer 1

你是对的，react-router-redux文档似乎建议不要让你的路由器以这种方式状态。

虽然Reselect选择器通常只使用第一个参数（状态），但它们实际上可以采用第二个参数（组件的props）。在这些道具中你会发现React Router传递的params（假设它们被传递给你试图connect的组件。

我在下面列出了一个简单的示例，其中我所做的只是location的上限，但你可以想象使你想要的复杂选择器包括使用state的其他选择器把东西带出Redux商店。

const selectLocation = (_state, props) => props.location;
const selector = createSelector(
  selectLocation, 
  (location) => ({ upperCasedLocation: location.toUpperCase() })
);

const MySmartComponent = (props) => <div>{props.upperCasedLocation}</div>;

export default connect(selector)(MySmartComponent);

访问选择器中的路由器状态

1 个答案: