我的 React 組件Loader獲得了一些道具。
物業contentAlign存在，只有當財產local存在，并且local === 'relative'，
我無法插入contentAlign，props因為我收到錯誤并且無法訪問contentAlign組件（樣式打開<div>），因為我不接受它props
我如何訪問contentAlign？
export type LoaderProps = {
className?: string;
background?: string;
size?: number;
} & (
| {
local?: Nullable<boolean>;
}
| {
local: 'relative';
contentAlign: LoaderContentAlign;
}
);
const Loader: React.FC<LoaderProps> = ({
className,
background = 'blue',
local = false,
size = 30,
...props
}: LoaderProps) => {
console.log('props ', props);
return (
<div
className={{local === 'relative' && `loader_content-${props.contentAlign}}}`
>
Content
</div>
);
};
uj5u.com熱心網友回復：
當您使用解構賦值時，Typescript 不會應用智能轉換。嘗試這個：
const Loader: React.FC<LoaderProps> = ({
className,
background = 'blue',
size = 30,
...props
}: LoaderProps) => {
console.log('props ', props);
return (
<div
className={{props.local === 'relative' && `loader_content-${props.contentAlign}}}`
>
Content
</div>
);
};
uj5u.com熱心網友回復：
只需使用的in運營商：
"contentAlign" in props && `loader_content-${props.contentAlign}`
試試吧。
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/345885.html