mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-24 11:10:01 +08:00
Code Issues Actions 25 Packages Projects Releases Wiki Activity

refactor(checkable-tag): improve code (#27097)

Browse Source
This commit is contained in:
Tom Xu 2020-10-12 15:07:47 +08:00 committed by GitHub
parent f0f39895b5
commit f487d8dba8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
components/tag/CheckableTag.tsx
View File

@ -8,13 +8,20 @@ export interface CheckableTagProps {
style?: React.CSSProperties; style?: React.CSSProperties;
checked: boolean; checked: boolean;
onChange?: (checked: boolean) => void; onChange?: (checked: boolean) => void;
onClick?: (e: React.MouseEventHandler<HTMLElement>) => void; onClick?: (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
} }
const CheckableTag: React.FC<CheckableTagProps> = props => { const CheckableTag: React.FC<CheckableTagProps> = ({
prefixCls: customizePrefixCls,
className,
checked,
onChange,
onClick,
...restProps
}) => {
const { getPrefixCls } = React.useContext(ConfigContext); const { getPrefixCls } = React.useContext(ConfigContext);
const handleClick = (e: React.MouseEventHandler) => {
const { checked, onChange, onClick } = props; const handleClick = (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => {
if (onChange) { if (onChange) {
onChange(!checked); onChange(!checked);
} }
@ -23,7 +30,6 @@ const CheckableTag: React.FC<CheckableTagProps> = props => {
} }
}; };
const { prefixCls: customizePrefixCls, className, checked, ...restProps } = props;
const prefixCls = getPrefixCls('tag', customizePrefixCls); const prefixCls = getPrefixCls('tag', customizePrefixCls);
const cls = classNames( const cls = classNames(
prefixCls, prefixCls,
@ -34,8 +40,7 @@ const CheckableTag: React.FC<CheckableTagProps> = props => {
className, className,
); );
delete (restProps as any).onChange; // TypeScript cannot check delete now. return <span {...restProps} className={cls} onClick={handleClick} />;
return <span {...(restProps as any)} className={cls} onClick={handleClick} />;
}; };
export default CheckableTag; export default CheckableTag;