我是TS新手,现在遇到了一个奇怪的问题。我似乎已经定义了所有内容,但似乎无法识别我输入的数据。
这是我所拥有的:
const Component = () => {
const [data, setData] = React.useState([[], []])
React.useEffect(() => {
fetchData()
}, [])
const fetchData = React.useCallback(async () => {
const data = await fetchDataController()
setData(data)
^^^^ error
})
}
这会引发错误,
Argument of type 'Element[][]' is not assignable to parameter of type 'SetStateAction<never[][]>'
Type 'Element[][]' is not assignable to type 'never[][]'
Type 'Element[]' is not assignable to type 'never[]'
Type 'Element is not assignable to type 'never'
我的函数fetchDataController
返回一个元素数组的数组。
我的类型如下:
type TData = {
id: string,
desc: string
}
我尝试做类似的事情,
const [data, setData] = React.useState<Array<TData[], TData[]>>([[], []])
但这似乎不起作用。我在这里想念什么?
你近了 Array<...>
需要一个参数,即数组中项目的类型。所以你可以做类似的事情Array<TData[]>
。如果你不想使用Array<...>
,你可以这样做TData[][]
,以及
所以,
React.useState<TData[][]>([[], []])
如果您想更加具体,请将其定义为Tuple,而不是通常的数组:
React.useState<[TData[], TData[]]>([[], []])
但是要使其正常工作,您必须向Typescript保证您要设置的内容(即data
in setData(data)
也是type)[TData[], TData[]]
。
你可以用类似的方法做到这一点 setData(data as [TData[], TData[]])
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句