Redux中Action Creator获取状态的两种模式优劣对比

我梳理了两种在Redux Action Creator里获取状态的实现方式，想和大家探讨下哪种方案更合适：

方案一：借助redux-thunk的getState方法 #

这种方案直接在Action Creator内部通过getState获取所需状态，不需要组件提前传递状态参数。

代码示例 #

组件部分：

class SomeComponent {
  render() {
    return (
      <Button onPress={this.props.networkCall}/>
    )
  }
}

const mapDispatchToProps = {
  networkCall: actions.networkCall,
}

export default connect(undefined, mapDispatchToProps)(SomeComponent)

Action Creator部分：

export function networkCall() {
  return (dispatch, getState) => {
    const { dataForNetworkCall } = getState().someReducer
    dispatch(pending())
    axios.get(`something/${dataForNetworkCall}/something2`)
      .then(() => {
        dispatch(success())
      })
      // 省略错误处理等后续逻辑
  }
}

方案二：组件通过mapStateToProps获取状态后传递给Action Creator #

这种方案需要组件先从Redux Store中拿到目标状态，再将其作为参数传入Action Creator。

代码示例 #

组件部分：

class SomeComponent {
  render() {
    const { networkCall, dataForNetworkCall } = this.props
    // 注：这里用箭头函数包裹，避免组件渲染时直接执行networkCall
    return (
      <Button onPress={() => networkCall(dataForNetworkCall)}/>
    )
  }
}

function mapStateToProps(state) {
  const { dataForNetworkCall } = state.someReducer
  return { dataForNetworkCall }
}

const mapDispatchToProps = {
  networkCall: actions.networkCall,
}

export default connect(mapStateToProps, mapDispatchToProps)(SomeComponent)

Action Creator部分：

export function networkCall(dataForNetworkCall) {
  return (dispatch) => {
    dispatch(pending())
    axios.get(`something/${dataForNetworkCall}/something2`)
      .then(() => {
        dispatch(success())
      })
      // 省略错误处理等后续逻辑
  }
}

我的疑问与思考 #

我觉得方案二的问题在于多了一层“状态从Store到组件再传回Action Creator”的冗余流转，但网上不少文章都称方案一是反模式，想请教下大家两种方案的优劣到底如何？

内容的提问来源于stack exchange，提问作者Steven Tchadenis