reactjs - 访问 mapStateToProps 内的状态属性

Question

我需要访问容器内 redux 状态的特定属性。这些属性将依次用作获取其他嵌套属性并将它们映射到组件 props 的键。我使用immutableJS。

是在 mapStateToProps 中执行此操作的最佳方法吗？这会导致任何性能开销吗？还是因为 mapStateToProps 已经接收到整个状态作为参数了？

这是一个示例。

状态选择器:

export const userSettingsState = state => state.get('userSettings');
export const transactionsState= state => state.get('transactions');

userSettings 是一个不可变的 Map，transactions 也是一个 userID 和交易列表对的 Map。

const mapStateToProps = (state) => {
  const curUID = userSettingsState(state).get('currentUserID');
  return {
    trList: transactionsState(state).getIn([curUID, 'trList'])
  };
};

我需要当前UID 来访问用户事务。上面的示例工作正常。但这是最好的方法吗？

Answer 1

很好的问题。是的，这是处理计算属性和生成派生数据的首选方法。这不仅是最好的方法，而且性能也非常好。 Cory House(社区中一位非常优秀的 React 开发者)在 Twitter 上发布了类似的内容 a few days ago他的方法同样适用于 mapStateToProps()。您唯一的其他选择是将计算方法添加到 componentWillReceiveProps() 和 componentDidMount()。正如你想象的那样，这一切很快就会变得困惑。

现在，我对您的做法有一些保留。

不要在这里放置异步调用!这也会导致渲染组件出现问题，因为 mapStateToProps() 在组件安装之前运行。如果您的组件在安装之前等待 promise ，那么您的性能将会受到影响。这可能是显而易见的。

说到性能，我个人为一个包含 8,600 个条目的下拉框生成与此完全相同的派生数据，在用户输入时，对这 8,600 个条目应用模糊过滤器，重新呈现下拉列表，并显示新的过滤列表。性能问题为零，并且该组件像黄油一样光滑。