mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-11 19:42:54 +08:00
Code Issues Actions 41 Packages Projects Releases Wiki Activity

Fix the bug that radio onchange will be ovrride by radioGroup onchange (#14364)

Browse Source 
* Fix the bug that radio onchange will be ovrride by radioGroup onchange

* Update

* Remove unused comment

* Add tests

* Update
This commit is contained in:
ztplz 2019-01-18 16:12:47 +08:00 committed by zombieJ
parent b1a96776d9
commit 2d5b625177
2 changed files with 43 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -68,6 +68,37 @@ describe('Radio', () => {
expect(onChange.mock.calls.length).toBe(2);
});
it('both of radio and radioGroup will trigger onchange event when they exists', () => {
const onChange = jest.fn();
const onChangeRadioGroup = jest.fn();
const wrapper = mount(
<RadioGroup onChange={onChangeRadioGroup}>
<Radio value="A" onChange={onChange}>
A
</Radio>
<Radio value="B" onChange={onChange}>
B
</Radio>
<Radio value="C" onChange={onChange}>
C
</Radio>
</RadioGroup>,
);
const radios = wrapper.find('input');
// uncontrolled component
wrapper.setState({ value: 'B' });
radios.at(0).simulate('change');
expect(onChange.mock.calls.length).toBe(1);
expect(onChangeRadioGroup.mock.calls.length).toBe(1);
// controlled component
wrapper.setProps({ value: 'A' });
radios.at(1).simulate('change');
expect(onChange.mock.calls.length).toBe(2);
});
it("won't fire change events when value not changes", () => {
const onChange = jest.fn();

14
components/radio/radio.tsx
View File

@ -5,7 +5,7 @@ import classNames from 'classnames';
import shallowEqual from 'shallowequal';
import RadioGroup from './group';
import RadioButton from './radioButton';
import { RadioProps, RadioGroupContext } from './interface';
import { RadioProps, RadioChangeEvent, RadioGroupContext } from './interface';
import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
export default class Radio extends React.Component<RadioProps, {}> {
@ -44,6 +44,16 @@ export default class Radio extends React.Component<RadioProps, {}> {
this.rcCheckbox = node;
};
onChange = (e: RadioChangeEvent) => {
if (this.props.onChange) {
this.props.onChange(e);
}
if (this.context.radioGroup && this.context.radioGroup.onChange) {
this.context.radioGroup.onChange(e);
}
};
renderRadio = ({ getPrefixCls }: ConfigConsumerProps) => {
const { props, context } = this;
const { prefixCls: customizePrefixCls, className, children, style, ...restProps } = props;
@ -52,7 +62,7 @@ export default class Radio extends React.Component<RadioProps, {}> {
const radioProps: RadioProps = { ...restProps };
if (radioGroup) {
radioProps.name = radioGroup.name;
radioProps.onChange = radioGroup.onChange;
radioProps.onChange = this.onChange;
radioProps.checked = props.value === radioGroup.value;
radioProps.disabled = props.disabled || radioGroup.disabled;
}