使用Redux Connect订阅单个Reducer仍获取所有Reducer数据的问题

首先，先澄清一个关键点：你的mapStateToProps写法是正确的——它只从Redux Store中提取了discoverSearch reducer的状态，所以组件的props里不会包含其他reducer的数据。你觉得在componentWillReceiveProps中收到所有Reducer的数据，大概率是误解：可能是你看到了dispatch、navigation等其他props，误以为是来自其他reducer的状态。

不过，我们还是来梳理下代码里的几个细节问题，确保组件只在discoverSearch状态变化时重新渲染：

1. 修复mapDispatchToProps的错误写法 #

你的connect第二个参数写的是：

dispatch => dispatch

这是不符合规范的写法。mapDispatchToProps的正确用法是返回一个包含action creator的对象；如果你不需要绑定任何自定义action creators，直接省略这个参数即可——connect会自动把dispatch函数注入到组件props中。

把connect的代码改成这样：

export default connect(
  store => ({ discoverSearch: store.discoverSearch })
  // 省略第二个参数，或写成 () => ({}) 如果你不需要dispatch属性
)(DiscoverSearchResultsContainer)

2. 确保组件仅在discoverSearch变化时重新渲染 #

默认情况下，connect会使用浅比较来对比mapStateToProps返回的前后props。你的DiscoverSearchReducer已经正确返回了新对象：

newState = { ...state, results: action.payload }

这部分逻辑没问题，但如果想进一步避免组件因无关props（比如navigation内部状态变化）触发更新，可以在类组件中实现shouldComponentUpdate方法：

shouldComponentUpdate(nextProps) {
  // 使用lodash的深比较，确保results内部数据变化也能被检测到
  return !_.isEqual(this.props.discoverSearch, nextProps.discoverSearch);
}

这样组件只会在discoverSearch的状态真正改变时才重新渲染。

3. 验证props的真实来源 #

你可以在componentWillReceiveProps中打印props的键来确认：

componentWillReceiveProps(nextProps) {
  console.log('组件接收的props:', Object.keys(nextProps));
  // 你会看到props只有discoverSearch、navigation、dispatch（如果保留），没有其他reducer的数据
}

这能帮你直观确认其他reducer的状态并没有进入组件的props。

总结 #

你的核心需求（组件仅监听discoverSearch reducer）已经通过正确的mapStateToProps实现了，修正mapDispatchToProps的写法后，再通过shouldComponentUpdate优化渲染逻辑，就能确保组件只在需要的时候更新。

内容的提问来源于stack exchange，提问作者Max Phillips