我正在使用Reaction查询从这个公共API:https://jsonplaceholder.typicode.com/todos获取TODO项的array.一旦获得TODO项的列表，我就将每个项映射到组件中的一个列表.以下是代码片段:
import axios from "axios";
import { useQuery } from "@tanstack/react-query";
interface Todo {
id: number;
title: string;
userId: number;
completed: boolean;
}
const fetchTodos = () => {
axios
.get<Todo[]>("https://jsonplaceholder.typicode.com/todos")
.then((res) => res.data);
};
const TodoList = () => {
const { data: todos } = useQuery({
queryKey: ["todos"],
queryFn: fetchTodos,
});
return (
<ul className="list-group">
{todos?.map((todo: Todo) => (
<li key={todo.id} className="list-group-item">
{todo.title}
</li>
))}
</ul>
);
};
export default TodoList;
当前，I VS Code引发了一个错误，即属性‘map’在类型‘Never’上不存在.我在控制台里也被告知:查询数据不能是未定义的.VS代码说todos是类型void | undefined.然而，当我将类型Todo[]指定为axios.get()的一部分时，我不认为这是可能的.
我试图显式定义fetchTodos()函数的返回类型，但没有成功.
任何帮助都将不胜感激！