需求是这样的,当我改变名称的时候,编码会调用后端的一个接口,然后展示到页面上,像这类如果用state,setState的话也是非常方便就能解决的,但是这个页面涉及编辑,新增,如果单独拿一个state的值来设,感觉有些不爽,而且目前用的redux-saga来写的全局代码,不准备用state.
下面是这个区域代码
代码语言：javascript复制const modalItems = [
{
type: 'select',
label: '设备类型',
paramName: 'equipTypeId',
initialValue: comeFromEdit.equipTypeId || this.props.myDeviceType[0] ? this.props.myDeviceType[0].value : '',
span: 12,
width: 138,
option: [
...this.props.myDeviceType
],
rules: rules.requiredSelect
},
{
type: 'input',
label: '设备名称',
paramName: 'equipName',
initialValue: comeFromEdit.equipName || '',
placeholder: '请输入',
span: 12,
onBlur: this.equipNameChange.bind(this),
width: 138,
rules: rules.required
},
{
type: 'text',
label: '设备编码',
paramName: 'equipCode',
initialValue: comeFromEdit.equipCode || '',
span: 12,
width: 138,
rules: rules.required
},
{
type: 'input',
label: '设备型号',
paramName: 'equipModel',
initialValue: comeFromEdit.equipModel || '',
placeholder: '请输入',
span: 12,
width: 138,
},
{
type: 'input',
label: '制造厂家',
paramName: 'equipCompany',
initialValue: comeFromEdit.equipCompany || '',
placeholder: '请输入',
span: 12,
width: 138
},
{
type: 'input',
label: '出租方',
paramName: 'lessor',
initialValue: comeFromEdit.lessor || '',
placeholder: '请输入',
span: 12,
width: 138,
rules: rules.required
},
];页面会根据这些数据然后驱动页面生成信息.
我把所有的初始值都直接先放上去了.
接下来是问题:
当我没有点保存的时候,编码会根据名称的变化而变化,
当我点了保存后,编码则不动了.
问题根源:
根据官方页面介绍,看不出什么原因(反正我看不明白).
据我的理解,是在点保存的时候,页面把编码的initalValue设置成了value,而value会把initalValue给覆盖了,再不能用initalValue来改变值了,事实也证明了这一点,我在react生命周期里,通过this.props.form.setFeildsValue()方法来改变编码的值就行的通了.代码如下:
代码语言：javascript复制componentWillReceiveProps(nextProps){
if(nextProps.comeFromEdit.equipCode !== this.props.comeFromEdit.equipCode){
try{
this.props.form.setFieldsValue({
equipCode:nextProps.comeFromEdit.equipCode
})
}catch (e){
console.log(e)
}
}
}多踩一个坑,以后就少一个!
