问题描述
我正在尝试按照教程学习类型脚本的反应。但是,当我构建解决方案时,我得到并出错。 代码
import React,{ useState,useEffect } from 'react';
import axios from 'axios';
const DataFetching = () => {
const [posts,setPosts] = useState([]);
useEffect(() => {
axios.get('https://jsonplaceholder.typicode.com/posts')
.then(res => {
console.log(res)
setPosts(res.data)
})
.catch(err => {
console.log(err)
})
})
return (
<div>
<ul>
{posts.map(post => (<li key={post.id}>{post.title}</li>))}
</ul>
</div>
);
};
export default DataFetching;
我遇到的错误
TypeScript error in src/DataFetching.tsx(21,43):
Property 'id' does not exist on type 'never'. TS2339
我正在关注以下教程https://www.youtube.com/watch?v=bYFYF2GnMy8。任何帮助或指导表示赞赏
解决方法
您应始终指定状态变量的VStack {
ForEach(Array(some_string.enumerated()),id: \.offset) { character in
Text(String(character.element))
}
}
。在这种情况下,您使用的是帖子数组。因此,您必须创建一个Post接口,并在.id
中使用该类型。
type
,
您应将类型明确添加到useState
。当您提供空数组打字稿推断时,其类型为never[]
。
const [posts,setPosts] = useState<Post>([]);