将对象写入状态

Question

需要通过点击注册将填写的对象传送到状态dataChanged

https://codesandbox.io/s/validation-devextreme-form-fso31

问题出在设置dataChanged状态时onFieldDataChanged属性。错误：

Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops

<Form
            formData={customer}
            readOnly={false}
            showColonAfterLabel={true}
            showValidationSummary={true}
            validationGroup="customerData"
            onFieldDataChanged={e => {
              let newData = e.component.option("formData");
              this.setState({
                dataChanged: newData
              });
            }}
>

Answer 1

与其在箭头函数中调用 setState 作为 prop，不如创建一个这样的函数：

onFieldChangeHandler = (e) => {
    const newData = e.component.option("formData");
    this.setState({
        dataChanged: newData
    });
}

并且在您的 Form 组件的 props 中：

onFieldDataChanged={this.onFieldChangeHandler}

将对象写入状态

Write object to state

javascript

devexpress

reactjs

devextreme