007-ant design 对象属性赋值,双向绑定

Posted bjlhx

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了007-ant design 对象属性赋值,双向绑定相关的知识,希望对你有一定的参考价值。

1、state对象属性赋值

设对象为

state={
 datavalue:{
      id:‘‘,
      name:‘‘,
     },
}

修改对象属性为:

SetName=(e)=>{
      let val=e.target.value;
      let data = Object.assign({}, this.state.datavalue, { name: val })
      this.setState({
        datavalue: data
      })
      console.log(this.state.datavalue,data)
}

2、双向绑定

// 第一个
         {getFieldDecorator(‘note‘, {
            rules: [{ required: true, message: ‘Please input your note!‘ }],
          })(
            <Input />
          )}
// 第二个
          {getFieldDecorator(‘gender‘, {
            rules: [{ required: true, message: ‘Please select your gender!‘ }],
          })(
            <Select
              placeholder="Select a option and change input text above"
              onChange={this.handleSelectChange}
            >
              <Option value="male">male</Option>
              <Option value="female">female</Option>
            </Select>
          )}

绑定值:

  handleSelectChange = (value) => {
    console.log(value);
    this.props.form.setFieldsValue({
      note: `Hi, ${value === ‘male‘ ? ‘man‘ : ‘lady‘}!`,
    });
  }

 

以上是关于007-ant design 对象属性赋值,双向绑定的主要内容,如果未能解决你的问题,请参考以下文章

WinForm 双向数据绑定

用纯JS实现双向数据绑定

Vue+Ant Design表单验证

js 超浓缩 双向绑定

vue中的数据绑定

vue双向绑定原理