diff --git a/components/radio/__tests__/group.test.js b/components/radio/__tests__/group.test.js
index cf62cccc24..dcb4203537 100644
--- a/components/radio/__tests__/group.test.js
+++ b/components/radio/__tests__/group.test.js
@@ -1,6 +1,6 @@
import React from 'react';
import { mount, render } from 'enzyme';
-import { render as testLibRender } from '@testing-library/react';
+import { fireEvent, render as testLibRender } from '@testing-library/react';
import Radio from '..';
describe('Radio Group', () => {
@@ -224,4 +224,16 @@ describe('Radio Group', () => {
});
});
});
+
+ it('onBlur & onFocus should work', () => {
+ const handleBlur = jest.fn();
+ const handleFocus = jest.fn();
+ const { container } = testLibRender(
+ ,
+ );
+ fireEvent.focus(container.firstChild);
+ expect(handleFocus).toHaveBeenCalledTimes(1);
+ fireEvent.blur(container.firstChild);
+ expect(handleBlur).toHaveBeenCalledTimes(1);
+ });
});
diff --git a/components/radio/group.tsx b/components/radio/group.tsx
index 76dead66dc..60ea4703c8 100644
--- a/components/radio/group.tsx
+++ b/components/radio/group.tsx
@@ -28,93 +28,91 @@ const RadioGroup = React.forwardRef((props, ref
}
};
- const renderGroup = () => {
- const {
- prefixCls: customizePrefixCls,
- className = '',
- options,
- buttonStyle = 'outline' as RadioGroupButtonStyle,
- disabled,
- children,
- size: customizeSize,
- style,
- id,
- onMouseEnter,
- onMouseLeave,
- } = props;
- const prefixCls = getPrefixCls('radio', customizePrefixCls);
- const groupPrefixCls = `${prefixCls}-group`;
- let childrenToRender = children;
- // 如果存在 options, 优先使用
- if (options && options.length > 0) {
- childrenToRender = options.map(option => {
- if (typeof option === 'string' || typeof option === 'number') {
- // 此处类型自动推导为 string
- return (
-
- {option}
-
- );
- }
- // 此处类型自动推导为 { label: string value: string }
+ const {
+ prefixCls: customizePrefixCls,
+ className = '',
+ options,
+ buttonStyle = 'outline' as RadioGroupButtonStyle,
+ disabled,
+ children,
+ size: customizeSize,
+ style,
+ id,
+ onMouseEnter,
+ onMouseLeave,
+ onFocus,
+ onBlur,
+ } = props;
+ const prefixCls = getPrefixCls('radio', customizePrefixCls);
+ const groupPrefixCls = `${prefixCls}-group`;
+ let childrenToRender = children;
+ // 如果存在 options, 优先使用
+ if (options && options.length > 0) {
+ childrenToRender = options.map(option => {
+ if (typeof option === 'string' || typeof option === 'number') {
+ // 此处类型自动推导为 string
return (
- {option.label}
+ {option}
);
- });
- }
+ }
+ // 此处类型自动推导为 { label: string value: string }
+ return (
+
+ {option.label}
+
+ );
+ });
+ }
- const mergedSize = customizeSize || size;
- const classString = classNames(
- groupPrefixCls,
- `${groupPrefixCls}-${buttonStyle}`,
- {
- [`${groupPrefixCls}-${mergedSize}`]: mergedSize,
- [`${groupPrefixCls}-rtl`]: direction === 'rtl',
- },
- className,
- );
- return (
-
+
{childrenToRender}
-
- );
- };
-
- return (
-
- {renderGroup()}
-
+
+
);
});
diff --git a/components/radio/interface.tsx b/components/radio/interface.tsx
index 89143e148f..e38d232829 100644
--- a/components/radio/interface.tsx
+++ b/components/radio/interface.tsx
@@ -20,6 +20,8 @@ export interface RadioGroupProps extends AbstractCheckboxGroupProps {
id?: string;
optionType?: RadioGroupOptionType;
buttonStyle?: RadioGroupButtonStyle;
+ onFocus?: React.FocusEventHandler;
+ onBlur?: React.FocusEventHandler;
}
export interface RadioGroupContextProps {