我正在構建一個帶有 react 和 typescript 的應用程式
我正在使用 props 將資料傳遞給子組件
我在父組件中將屬性的資料型別宣告為介面
傳遞給子組件
但我收到了它不對應的錯誤
父組件
interface IProperty {
property: {
title: string;
}[];
}
const Dashboard = () => {
const [loading, setLoading] = useState(true);
const [properties, setProperties] = useState<IProperty["property"]>([
{
title: "New estate"
}
]);
return (
<div className="__recent-upload">
<ListOfProperties loading={loading} datas={properties} />
</div>
)
export default Dashboard
子組件
interface IProperty {
property: {
title: string;
}[];
}
const ListOfProperties: React.FC<{ loading: boolean, datas: IProperty }> = ({ loading, datas }) => {
return (
<div>
<h4 className="ml-4">Newly uploaded Properties</h4>
<Skeleton active loading={loading}>
<div className="table">
</div>
</Skeleton>
</div>
);
};
export default ListOfProperties;
錯誤
TS2741: Property 'property' is missing in type '{ title: string; }[]'
but required in type 'IProperty'.
uj5u.com熱心網友回復：
您有兩種可能的解決方案：1-對 useState 使用相同的型別
const [properties, setProperties] = useState<IProperty>([{
property: {
title: "New estate"
}
}]);
2-或繞過正確的物件到道具
<ListOfProperties loading={loading} datas={
{property:properties}
} />
uj5u.com熱心網友回復：
您的錯誤來自這樣data一個事實，即期望一個帶有property密鑰的完整物件。但是你只發送一個陣列[ {title: "foo" } ]。
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/403092.html
標籤：