时间戳

首页 > 解决方案 > 如何在任何连接的组件中获取调度函数引用和动作创建者作为道具

reactjs - 如何在任何连接的组件中获取调度函数引用和动作创建者作为道具

问题描述

我们在连接的组件中获得了 dispatch function ref，但是当我们在 connect 函数中使用 action creator 参数时，它不会像以前那样返回 dispatch function。

案例 1.只有连接函数的第一个参数。

import React, { Component } from 'react';
import { connect } from 'react-redux';

class App extends Component {
  render() {
    console.log('this.props',this.props)
    return (
      <div className="App">
        App
      </div>
    );
  }
}
const mapStateToProps = (state) => {
  return state
}
export default connect(mapStateToProps)(App);

案例 2.也使用 connect 的第二个参数

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { setData } from './actions'

class App extends Component {
  render() {
    console.log('this.props',this.props)
    return (
      <div className="App">
        App
      </div>
    );
  }
}
const mapStateToProps = (state) => {
  return state
}
export default connect(mapStateToProps,{ setData })(App);

我希望在第二种情况下，调度函数 ref 也应该在 props 中列出，但它没有发生。

控制台输出：案例 1. dispatch 显示在 props https://prnt.sc/ne0fpb

案例 2. 没有 dispatch get in props https://prnt.sc/ne0djb

所以请帮助我为什么我没有在案例 2 中获得调度功能？

标签： reactjsreduxreact-redux

解决方案

第二个connect参数 ( mapDispatchToProps) 默认为dispatch => ({ dispatch })函数。指定时不应用默认值。

由于mapDispatchToProps用于提供所有需要的调度程序功能作为组件道具，dispatch因此不需要道具。

推荐阅读