我需要構建一個鉤子來做一些通用樣式并在我的專案中使用它。我嘗試執行以下操作:
export const textStyles = () => {
const styles = {
TextMd,
};
return styles;
};
const TextMd: React.FC<{ className: string }> = ({ className }) => {
return (
<p
className={`block transform transition-colors duration-200 py-2 hover:text-gray-800 text-gray-800 .leading-relaxed ${className}`}
></p>
);
};
我這樣使用它:
import { textStyles } from '../utils/stiles.tsx'
const { TextMd } = textStyles();
<TextMd>Hello world</TextMd>
uj5u.com熱心網友回復:
只需添加 children 屬性
import {ReactNode} from 'react'
const TextMd: React.FC<{ className: string, children: ReactNode }> = ({ className, children }) => {
return (
<p
className={`block transform transition-colors duration-200 py-2 hover:text-gray-800 text-gray-800 .leading-relaxed ${className}`}
>{children}</p>
);
};
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/415560.html
標籤:
