我试图在redux工具包中构建一个查询,用于获取和过滤搜索。但我得到这个错误在我的控制台
Uncaught(in promise)TypeError:result.map不是函数或其返回值不可迭代
这是我的代码
getSearchByValue: builder.query({
// Will make a request like https://pokeapi.co/api/v2/pokemon/bulbasaur
query: (value) => `/search?q=${value}`,
providesTags: (result, err, args) =>
result
? [{ type: 'Post', value: 'LIST' }, ...result.map(({ value }) => ({ type: 'Post', value }))]
: [{ type: 'Post', value: 'LIST' }],
这是我的post文件
const Posts = ({ value }) => {
const { data: posts, isLoading } = useGetSearchByValueQuery
(value, {
refetchOnMountOrArgChange: true,
});
const [filteredPosts, setFilteredPosts] = useState([]);
useEffect(() => {
setFilteredPosts(posts?.filter(post => post.title.toLowerCase().includes(value.toLowerCase())));
}, [value, posts]);
return isLoading ? (
<LoadingSpinner />
) : (
filteredPosts && <Postsabc posts={filteredPosts} enableImages={false} />
);
};
const Wrapper = tw.div`bg-blue`;
export default Posts;
value是用户在搜索栏中键入的搜索值
我试了很多方法,但我不能理解
1条答案
按热度按时间js5cn81o1#
您看到的错误消息表明providesTags函数中的结果值不是数组,因此没有map方法。如果对/search端点的请求返回非数组值或请求中有错误,则可能发生这种情况。
要调试此问题,可以首先在providesTags函数中记录结果值,以查看它是什么类型的值。您还可以向查询添加catch块,以记录可能发生的任何错误。
你的代码应该是这样的,包括这些变化:
通过记录结果值并检查错误,您应该能够确定问题的根本原因并对代码进行任何必要的更改