mapstatetoprops和mapdispatchtoprops之间有什么区别[重复]

Question

这个问题在这里已有答案：

• What is mapDispatchToProps? 6个答案

mapStateToProps和mapDispatchToProps对反应还原中connect函数的论证有什么区别？任何人都可以用例子给出合适的解释

Answer 1

mapStateToProps是一个用于向组件提供商店数据的函数，而mapDispatchToProps则用于将动作创建者作为组件的道具提供。

根据文件：

如果指定了mapStateToProps参数，则新组件将订阅Redux存储更新。这意味着每次更新商店时，都会调用mapStateToProps。 mapStateToProps的结果必须是一个普通的对象，它将被合并到组件的道具中。

使用mapDispatchToProps将每个动作创建者包装到一个调度调用中，这样它们可以被直接调用，将​​被合并到组件的道具中。

一个简单的例子就是

function mapStateToProps(state) {
  return { todos: state.todos }
}

function mapDispatchToProps(dispatch) {
  return { addTodo: bindActionCreators(addTodo, dispatch) }
}

export default connect(mapStateToProps, mapDispatchToProps)(Todos);

Answer 2

在一个非常简单的术语中，

mapStateToProps：它将redux状态连接到react组件的props。

mapDispatchToProps：它连接redux动作以反应道具。

一个非常轻松的例子:(我希望，你知道我的意思）

// state
const mapStateToProps = state => {
  return { lists: state.lists };
};

// props
const mapDispatchToProps = ({ lists }) => (
  <ul>
    { 
      lists.map(el => (
        <li key={ el.id }>
          { el.heading }
        </li>
      )
    }
  </ul>
);

// Now, connect state to prop
const List = connect(mapStateToProps)(mapDispatchToProps);

Answer 3

用非常简单的术语：

当您想从组件中获取全局状态的值时，将调用mapStateToProps

function mapStateToProps(state) {
  return {
    message: state.message

  };
}

全局状态的值仅在动作的帮助下更改。因此，如果要更改全局状态的值，则需要执行操作。 mapDispatchToProps用于绑定组件中的动作。