github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: Radio.Group triggers multiple change callback issues #1280

pull/1322/head
tanjinzhou 2019-10-18 13:05:35 +08:00
parent a0c887479a
commit b5cd32aa1a
2 changed files with 15 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/radio/Group.jsx
View File

@ -30,6 +30,7 @@ export default {
}, },
data() { data() {
const { value, defaultValue } = this; const { value, defaultValue } = this;
this.updatingValue = false;
return { return {
stateValue: value === undefined ? defaultValue : value, stateValue: value === undefined ? defaultValue : value,
}; };
@ -61,6 +62,7 @@ export default {
}, },
watch: { watch: {
value(val) { value(val) {
this.updatingValue = false;
this.stateValue = val; this.stateValue = val;
}, },
}, },
@ -72,11 +74,13 @@ export default {
this.stateValue = value; this.stateValue = value;
} }
// nextTick for https://github.com/vueComponent/ant-design-vue/issues/1280 // nextTick for https://github.com/vueComponent/ant-design-vue/issues/1280
this.$nextTick(() => { if (!this.updatingValue && value !== lastValue) {
if (value !== lastValue) { this.updatingValue = true;
this.$emit('input', value); this.$emit('input', value);
this.$emit('change', ev); this.$emit('change', ev);
} }
this.$nextTick(() => {
this.updatingValue = false;
}); });
}, },
}, },

11
components/radio/__tests__/group.test.js
View File

@ -80,8 +80,6 @@ describe('Radio', () => {
wrapper.vm.$refs.radioGroup.stateValue = 'B'; wrapper.vm.$refs.radioGroup.stateValue = 'B';
// wrapper.setData({ value: 'B' }) // wrapper.setData({ value: 'B' })
radios.at(0).trigger('change'); radios.at(0).trigger('change');
});
await asyncExpect(() => {
expect(onChange.mock.calls.length).toBe(1); expect(onChange.mock.calls.length).toBe(1);
}); });
await asyncExpect(() => { await asyncExpect(() => {
@ -91,8 +89,6 @@ describe('Radio', () => {
// controlled component // controlled component
wrapper.setProps({ value: 'A' }); wrapper.setProps({ value: 'A' });
radios.at(1).trigger('change'); radios.at(1).trigger('change');
});
await asyncExpect(() => {
expect(onChange.mock.calls.length).toBe(2); expect(onChange.mock.calls.length).toBe(2);
}); });
await asyncExpect(() => { await asyncExpect(() => {
@ -135,9 +131,7 @@ describe('Radio', () => {
wrapper.vm.$refs.radioGroup.stateValue = 'B'; wrapper.vm.$refs.radioGroup.stateValue = 'B';
radios.at(0).trigger('change'); radios.at(0).trigger('change');
expect(onChange.mock.calls.length).toBe(1); expect(onChange.mock.calls.length).toBe(1);
await asyncExpect(() => {
expect(onChangeRadioGroup.mock.calls.length).toBe(1); expect(onChangeRadioGroup.mock.calls.length).toBe(1);
});
// controlled component // controlled component
wrapper.setProps({ value: 'A' }); wrapper.setProps({ value: 'A' });
@ -159,13 +153,12 @@ describe('Radio', () => {
// uncontrolled component // uncontrolled component
wrapper.vm.$refs.radioGroup.stateValue = 'B'; wrapper.vm.$refs.radioGroup.stateValue = 'B';
radios.at(0).trigger('change'); radios.at(0).trigger('change');
await asyncExpect(() => {
expect(onChange.mock.calls.length).toBe(1); expect(onChange.mock.calls.length).toBe(1);
});
asyncExpect(() => {
// controlled component // controlled component
wrapper.setProps({ value: 'A' }); wrapper.setProps({ value: 'A' });
radios.at(1).trigger('change'); radios.at(1).trigger('change');
await asyncExpect(() => {
expect(onChange.mock.calls.length).toBe(2); expect(onChange.mock.calls.length).toBe(2);
}); });
}); });