diff --git a/packages/checkbox/index.vue b/packages/checkbox/index.vue index 7fbd95ad1..d9fbbd50c 100644 --- a/packages/checkbox/index.vue +++ b/packages/checkbox/index.vue @@ -6,7 +6,7 @@ b('icon'), `van-checkbox--${shape}`, { 'van-checkbox--disabled': isDisabled, - 'van-checkbox--checked': isChecked + 'van-checkbox--checked': checked }]" @click="onClick" /> @@ -40,7 +40,7 @@ export default create({ }, computed: { - currentValue: { + checked: { get() { return this.parent ? this.parent.value.indexOf(this.name) !== -1 @@ -74,15 +74,6 @@ export default create({ } }, - isChecked() { - const { currentValue } = this; - if ({}.toString.call(currentValue) === '[object Boolean]') { - return currentValue; - } else if (this.isDef(currentValue)) { - return currentValue === this.name; - } - }, - isDisabled() { return (this.parent && this.parent.disabled) || this.disabled; } @@ -101,7 +92,7 @@ export default create({ methods: { onClick(target) { if (!this.isDisabled && !(target === 'label' && this.labelDisabled)) { - this.currentValue = !this.currentValue; + this.checked = !this.checked; } } } diff --git a/packages/checkbox/test/index.spec.js b/packages/checkbox/test/index.spec.js new file mode 100644 index 000000000..23a9d824b --- /dev/null +++ b/packages/checkbox/test/index.spec.js @@ -0,0 +1,72 @@ +import Checkbox from '..'; +import CheckboxGroup from '../../checkbox-group'; +import { mount } from '@vue/test-utils'; + +test('switch checkbox', () => { + const wrapper = mount(Checkbox); + + wrapper.vm.$on('input', value => { + wrapper.setData({ value }); + }); + + const icon = wrapper.find('.van-checkbox__icon'); + icon.trigger('click'); + icon.trigger('click'); + + expect(wrapper.emitted('input')).toEqual([[true], [false]]); + expect(wrapper.emitted('change')).toEqual([[true], [false]]); +}); + +test('disabled', () => { + const wrapper = mount(Checkbox, { + propsData: { + disabled: true + } + }); + + wrapper.find('.van-checkbox__icon').trigger('click'); + expect(wrapper.emitted('input')).toBeFalsy(); +}); + +test('label disabled', () => { + const wrapper = mount(Checkbox, { + slots: { + default: '
' + }, + propsData: { + labelDisabled: true + } + }); + + wrapper.find('.van-checkbox__label').trigger('click'); + expect(wrapper.emitted('input')).toBeFalsy(); +}); + +test('checkbox group', () => { + const wrapper = mount({ + template: ` + + + + `, + components: { + Checkbox, + CheckboxGroup + }, + data() { + return { + result: [], + list: ['a', 'b', 'c', 'd'] + }; + } + }); + + const icons = wrapper.findAll('.van-checkbox__icon'); + icons.at(0).trigger('click'); + icons.at(1).trigger('click'); + icons.at(2).trigger('click'); + expect(wrapper.vm.result).toEqual(['a', 'b']); + + icons.at(0).trigger('click'); + expect(wrapper.vm.result).toEqual(['b']); +});