this.props.change 不会导致重新渲染新值

Question

这是一个触发的 onClick 处理程序：

fieldClicked(field) {

let selectedDescription = this
  .props
  .serviceConfigInfoValue
  .find(x => x.Name == field)
  .Description

this
  .props
  .change('currentFieldDescription', selectedDescription)

}

这会导致在表单状态中设置正确的值，并导致更新字段，该字段设置为在表单的其他位置读取该值。

<Field
            name="currentFieldDescription"
            component={SimpleTextAreaInput}
            rows={10}
            cols={50}/>

这是 SimpleTextAreaInput 组件。事实上，在 Chrome 的调试中，我什至看到正确的描述传递到值中。

问题是屏幕没有使用更新后的描述值呈现。

import React, {Component} from "react";

export default(field) => {

 const {
  input: {
   value,
   onChange
 },
 rows,
 cols
 } = field

 return (
   <div>
     <p>Redux-forms Text Area</p>
     <textarea rows={rows} cols={cols}>{value}</textarea>
   </div>
)

}

Answer 1

在 React 中，a 使用值属性代替。这样，使用 a 的表单可以与使用单行输入的表单非常相似地编写

<textarea value={this.state.value} onChange={this.handleChange} />

你必须给它作为道具的价值。

this.props.change 不会导致重新渲染新值

this.props.change does not cause re-render of new value

redux-form