diff --git a/src/checkbox/README.md b/src/checkbox/README.md index d882fb8ed..62605e305 100644 --- a/src/checkbox/README.md +++ b/src/checkbox/README.md @@ -155,6 +155,7 @@ export default { | label-position | Can be set to `left` | *string* | `right` | - | | icon-size | Icon size | *string \| number* | `20px` | - | | checked-color | Checked color | *string* | `#1989fa` | - | - | +| bind-group | Whether to bind with CheckboxGroup | *boolean* | `true` | 2.2.4 | ### CheckboxGroup Props diff --git a/src/checkbox/README.zh-CN.md b/src/checkbox/README.zh-CN.md index f23e09b8a..7d6497170 100644 --- a/src/checkbox/README.zh-CN.md +++ b/src/checkbox/README.zh-CN.md @@ -157,6 +157,7 @@ export default { | label-position | 文本位置,可选值为 `left` | *string* | `right` | - | | icon-size | 图标大小,默认单位为`px` | *string \| number* | `20px` | - | | checked-color | 选中状态颜色 | *string* | `#1989fa` | - | +| bind-group | 是否与复选框组绑定 | *boolean* | `true` | 2.2.4 | ### CheckboxGroup Props diff --git a/src/checkbox/test/index.spec.js b/src/checkbox/test/index.spec.js index 75f87cc2a..948f1c5a2 100644 --- a/src/checkbox/test/index.spec.js +++ b/src/checkbox/test/index.spec.js @@ -131,3 +131,27 @@ test('checked-color prop', () => { expect(wrapper).toMatchSnapshot(); }); + +test('bind-group prop', async () => { + const wrapper = mount({ + template: ` + + + + + `, + data() { + return { + value: false, + result: [], + list: ['a', 'b', 'c'] + }; + } + }); + + const icons = wrapper.findAll('.van-checkbox__icon'); + icons.at(0).trigger('click'); + await later(); + expect(wrapper.vm.result).toEqual([]); + expect(wrapper.vm.value).toBeTruthy(); +}); diff --git a/src/mixins/checkbox.js b/src/mixins/checkbox.js index 0b24e5297..99ca478bb 100644 --- a/src/mixins/checkbox.js +++ b/src/mixins/checkbox.js @@ -19,10 +19,18 @@ export const CheckboxMixin = ({ parent, bem, role }) => ({ shape: { type: String, default: 'round' + }, + bindGroup: { + type: Boolean, + default: true } }, computed: { + disableBindRelation() { + return !this.bindGroup; + }, + isDisabled() { return (this.parent && this.parent.disabled) || this.disabled; }, diff --git a/src/mixins/relation.ts b/src/mixins/relation.ts index aaadb460b..650912aac 100644 --- a/src/mixins/relation.ts +++ b/src/mixins/relation.ts @@ -21,6 +21,10 @@ function flattenVNodes(vnodes: VNode[]) { return result; } +type ChildrenMixinThis = { + disableBindRelation?: boolean; +}; + export function ChildrenMixin(parent: string, options: ChildrenMixinOptions = {}) { const indexKey = options.indexKey || 'index'; @@ -33,6 +37,10 @@ export function ChildrenMixin(parent: string, options: ChildrenMixinOptions = {} computed: { parent() { + if ((this as ChildrenMixinThis).disableBindRelation) { + return null; + } + return (this as any)[parent]; },