问题描述
- 给表单中的每一个表单项传入一个参数的时候,参数已经传进去了,但是initialValue并没有发生变化。
原因
这是因为调用resetFileds的时机不对,也就是生命周期的问题。
解决办法
- 在生命周期函数componentDidUpdate中添加下面的代码即可。
componentDidUpdate() {
if (this.formRef.current !== null) {
this.formRef.current.resetFields();
}
}
全部代码
export default class UpdateForm extends Component {
formRef = React.createRef();
static propTypes = {
categoryName: PropTypes.string.isRequired
}
componentDidUpdate() {
if (this.formRef.current !== null) {
this.formRef.current.resetFields();
}
}
render() {
const { categoryName } = this.props;
console.log(categoryName);
return (
<Form ref={this.formRef}>
<Item initialValue={categoryName} name="categoryName" >
<Input placeholder="请输入分类名称" />
</Item>
</Form>
)
}
}