ant form.item 两个item关联校验 如单选框和多选框等选项选一个也通过校验

首先在其中之一的控件中,如多选CheckBox.group设置好你需要的规则,例如判断单选和多选其中选了一个就通过校验callback( ),若是两个都没有选  &&  则弹出错误提示。随后在另一个控件中设置自定义校验规则,利用form.ValidateFields方法,此方法中单独校验我们上面写好的那个控件,可以实现功能。

若是单独要给单选框设置,取消选中,可以在点击事件中校验单选框,单选框的校验规则中,校验多选框,取消错误,可以利用form.setFields将errors设置为null  [   ]。

但注意Form.setFields 是一定会是错误状态的,一定会给控件加上has-errors类名。

 

好的,您的问题是如何在 ant design vue2 两个表格,其一个添加复框。 您可以使用 ant design vue2 的 `<a-checkbox>` 组件来实现复框的功能。您可以在一个表格添加这个组件,然后在表格的每一行使用它来实现复框的效果。 以下是一个示例代码,其一个表格没有复框,第二个表格添加了复框: ```html <template> <div> <a-table :columns="columns1" :data-source="data1" /> <a-table :columns="columns2" :data-source="data2"> <template slot="selection" slot-scope="{ selectedRowKeys, onChange }"> <a-checkbox-group :value="selectedRowKeys" @change="onChange"> <a-checkbox :value="row.id" v-for="row in data2" :key="row.id">{{ row.name }}</a-checkbox> </a-checkbox-group> </template> </a-table> </div> </template> <script> export default { data() { return { columns1: [ { title: 'Name', dataIndex: 'name', key: 'name', }, { title: 'Age', dataIndex: 'age', key: 'age', }, { title: 'Address', dataIndex: 'address', key: 'address', }, ], data1: [ { key: '1', name: 'John Brown', age: 32, address: 'New York No. 1 Lake Park', }, { key: '2', name: 'Jim Green', age: 42, address: 'London No. 1 Lake Park', }, { key: '3', name: 'Joe Black', age: 32, address: 'Sidney No. 1 Lake Park', }, ], columns2: [ { title: 'Name', dataIndex: 'name', key: 'name', }, { title: 'Age', dataIndex: 'age', key: 'age', }, { title: 'Address', dataIndex: 'address', key: 'address', }, ], data2: [ { id: 1, name: 'John Brown', age: 32, address: 'New York No. 1 Lake Park', }, { id: 2, name: 'Jim Green', age: 42, address: 'London No. 1 Lake Park', }, { id: 3, name: 'Joe Black', age: 32, address: 'Sidney No. 1 Lake Park', }, ], }; }, }; </script> ``` 在上面的代码,第一个表格没有添加复框。而在第二个表格,我们添加了一个名为 `selection` 的插槽,用于展示复框。然后在插槽,我们使用 `<a-checkbox-group>` 组件来包含所有的复框,使用 `<a-checkbox>` 组件来渲染每一行的复框。我们还需要使用 `slot-scope` 属性来获取已的行和更改已行的事件。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值