代码之家 › 专栏 › 技术社区 › Xero

创建组件时的调度操作

react-redux redux reactjs

Xero · 技术社区 · 6 年前

我有一个这样的组件:

class FormItem extends React.PureComponent {

    constructor(props){
        super();
        props.dispatch(setFormCreated(props.formBuilder, props.formId)); 
    }

   render(){
       ...
   }
}

const mapStateToProps = state => {
    return {
        doValidation: state.formsReducer.validationRequested
    };
};

const mapDispatchToProps = dispatch => ({
    onValidationSucceed: formId =>  dispatch(setFormValidationSucceed(formId)),
    onValidationFailed: formId => dispatch(setFormValidationFailed(formId))
});

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

我想在创建组件时分派一个操作。第5行:

props.dispatch(setFormCreated(props.formBuilder, props.formId));

但我得到了:

类型错误:props.dispatch不是函数

2 回复 | 直到 6 年前

Bhojendra Rauniyar 6 年前

在使用构造函数内的props之前,需要将props传入super:

super(props);

Dan 6 年前

const mapDispatchToProps = dispatch => ({
    onValidationSucceed: formId =>  dispatch(setFormValidationSucceed(formId)),
    onValidationFailed: formId => dispatch(setFormValidationFailed(formId))
    onFormCreated: (formBuilder, formId) => dispatch(setFormCreated(formBuilder, formId))
});

在您的组件中,您可以使用以下代码(我将把您的代码放在 componentDidMount )这也假设你路过 formBuilder 和 formId 作为道具。

componentDidMount() {
  const { onFormCreated, formBuilder, formId } = this.props;
  onFormCreated(formBuilder, formId)
}

推荐文章

Piotr Chmielowiec · 组件从一个调度发出两个api调用

2 年前

Mistakamikaze · React Redux |在全局Redux状态之前更新本地状态

2 年前

Storm28 · 错误:函数作为子函数无效。如果从渲染返回组件而不是<Component/>,则可能会发生这种情况

2 年前

Stephen Aranda · 如何使用React在前端UI上显示API响应消息?

2 年前

khalil hajri · 无效的钩子调用。钩子只能在函数组件的主体内部调用(react native)

2 年前

ShaySS · 如果我不需要将数据存储在redux存储中,我是否必须使用redux saga从API获取数据?

2 年前

arya.s · Toast错误消息在React/Redux中多次显示。如何避免?

2 年前

jack · 注销后清除redux商店

2 年前

Emm · 添加CombineReducer后无法读取未定义(读取“map”)的属性

2 年前

MariaT · 如何使用bootstrap 4在折叠菜单后面获取徽章?

6 年前