当前位置： 移动技术网 > IT编程>开发语言>JavaScript > react+antd 给switch设置初始值变量

react+antd 给switch设置初始值变量

2020年07月24日  | 移动技术网IT编程  | 我要评论

在react项目使用antd组件中的switch功能，设置初始值为变量，所以需要在 Form.Item 标签上添加一个 valuepropname={初始值}  

错误示范：

<Form.Item label="开关">
   <Switch defaultChecked={data.type} checkedChildren="开启" unCheckedChildren="关闭" onChange={this.onchange} size="default" />
</Form.Item>

记得加上key值，不然浏览器的控制台会报错 

正确示范

<Form.Item label="开关" valuepropname={data.type} key={data.type}>
   <Switch defaultChecked={data.type} checkedChildren="开启" unCheckedChildren="关闭" onChange={this.onchange} size="default" />
</Form.Item>


在触发onchange事件的时候改变switch的值
onchange = async (checked) => {
    const { data } = this.props;
 if (checked === false) {
    data.type = 0;
    调用接口修改switch状态
 } else if (checked === true) {
     data.type = 1;
     调用接口修改switch状态
  }
};

 

本文地址：https://blog.csdn.net/Liberal_w/article/details/107523294

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网