如何解决如何为对象定义正确的数据类型
我把这个当成我的道具
export const LineChart = () => {
const data = [
{
date: "2021/07/01",books: 10
},{
date: "2021/07/02",books: 25
},{
date: "2021/07/03",books: 15
},{
date: "2021/07/04",books: 48
},{
date: "2021/07/05",books: 102
},{
date: "2021/07/06",books: 59
},{
date: "2021/07/07",books: 37
}
];
return <Chart data={data} />;
};
我在组件中接收这些数据作为 props
export const Chart = ({ data }:**type of data***) => (
<chart
data={data}
type="monotone"
dataKey="reviews"
stroke="#c80acc"
activeDot={{ r: 8 }}
/> );
我们如何在 typescript 中定义 prop Data 的类型,我是 typescript 的新手,我将数据作为对象接收。数据类型任何工作,但它不是正确的类型,如何定义上述对象的数据类型并摆脱类型错误,(代码工作正常)
解决方法
你可以这样声明:
{ data }: {data: Array<{ date: string; books: number }>}
,
试试这个方法,
export const Chart = ({ data }: {data: { date: string; books: number }[]}) => (
<chart data={data}
type="monotone"
dataKey="reviews"
stroke="#c80acc"
activeDot={{ r: 8 }}
/> );
代码沙盒 - https://codesandbox.io/s/bold-moon-hr9ne?file=/src/App.tsx
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。