我正在尋找 TypeScript React 中的解決方案來傳遞陣列中的多個組件。我已經宣告了介面并將其匯入到我的組件中。但它給了我一個錯誤，因為'型別'元素'沒有與型別'IDataView''相同的屬性。
我已將代碼片段添加到我正在遵循的步驟中。我不確定下面的代碼中缺少什么。
我的父組件：
const DataViewContainer:React.FC = () => {
return (
<ViewCollection views={[<BarChart />, <LineChart />]} />
)
}
子組件：
interface IViewCollection {
views: IDataView[]
}
interface IDataView {
barChartView?: React.ReactNode;
lineChartView?: React.ReactNode;
}
const ViewCollection = (views: IViewCollection): JSX.Element => {
return (
<Carousel>
{views.map((cmp) => { return (cmp) }}
</Carousel>
)
}
uj5u.com熱心網友回復：
根據您的型別，您應該傳遞一個物件。注意 的修復props，views以及組件內部的用法ViewCollection。
const DataViewContainer: React.FC = () => {
return (
<ViewCollection
views={{ barChartView: <BarChart />, lineChartView: <LineChart /> }}
/>
);
};
const ViewCollection = (props: IViewCollection): JSX.Element => {
return (
<Carousel>
{props.views.barChartView}
{props.views.lineChartView}
</Carousel>
);
};
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/476386.html
標籤：javascript 反应 打字稿
上一篇：錯誤：預期`onClick`偵聽器是一個函式，而不是`object`型別的值
下一篇：洗掉有條件的重復物件