React自定义组件默认标签属性添加,...rest把组件默认标签属性传递下来。如果组件内有相同属性,则组件内属性值为最终值,除非例如className,onClick那样去处理继承全并属性值
//HTMLElement|TMLLinkElement|HTMLInputElement....
type HTMLProps = HTMLAttributes<HTMLDivElement>;
type OwnerProps = {
// data: pdfDataType;
// render?: (loading: boolean) => ReactNode;
// position_id?: number;
};
type Props = Readonly<HTMLProps & OwnerProps>;
const ContentNone: FC<Props> = memo(({children, className,onClick, ...rest}) => {
const clickHander = (event: React.MouseEvent<HTMLDivElement>): void => {
onClick?.(event);
console.log('22222');
};
return (
<div className={classNames(className, styles.container)} {...rest} onClick={clickHander}>
<NoneIcon />
{children}
</div>
);
});
export default ContentNone;
组件引用:
<ContentNone className={styles.bg} onClick={()=>console.log('222222')}>无搜索结果,建议修改关键词</ContentNone>