时间戳

首页 > 解决方案 > Redux 表单问题（dispatch 不起作用？）

reactjs - Redux 表单问题（dispatch 不起作用？）

问题描述

更新：从我给你的信息中无法解决，问题是代码在 ComponentReceiveProps 钩子中更新并且原始值覆盖了更改的值。

我从事的项目是由外部机构开发的，但没有做得最好。

它是使用 React、Redux 和 Redux-Forms 的前端应用程序

有一种形式用于两个不同的页面。它在一页中运行良好，但在另一页中没有反应。我无法通过 UI 更改输入值，也无法通过changeFieldValue功能更改。Redux 状态没有改变。

在这两种情况下，都使用相同的组件。它包含reduxForm功能。

const mapDispatchToProps = dispatch => ({
    changeFieldValue: (field, value) => dispatch(change('ContractConsumption', field, value)),
});

class ContractConsumption extends React.Component {
 // ...
}
ContractConsumption = reduxForm({
    form: 'ContractConsumption',
    enableReinitialize: true
})(ContractConsumption);

任何帮助，将不胜感激。我很困惑，为什么带有 redux 形式的相同组件在一种情况下可以工作，而在另一种情况下却不行。

整个代码过于复杂且高度耦合，因此无法轻松共享或逐部分测试。

标签： reactjsreduxredux-form

解决方案

您/代理商似乎没有将表单连接到商店：

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

class Example extends Component {
    // ...
};

const mapStateToProps = (state) => ({
    // ...
});

const mapDispatchToProps = (dispatch)  => ({
    // ...
});

Example = connect(
    mapStateToProps,
    mapDispatchToProps
)(Example);

export default reduxForm({
    form: 'example' // a unique name for this form
})(Example);

请参阅如何使用 mapStateToProps 或 mapDispatchToProps？

推荐阅读