如何通过 RTK 查询将对象传递到 Express 后端

Question

我已经成功发送了一个工作正常的值，但是现在我想发送多个值，但我不能。

过滤切片：

const initialState = {
    searchTerm: "",
    category: "all",
};
...

RTK查询：

getRecipes: builder.query({
            query: (filter) => ({
                url: "/api/recipes",
                params: { filter },
            }),
            providesTags: ["Recipes"],
        }),

在我的组件中我有：

const filter = useSelector((state) => state.filter);
console.log(filter); // {searchTerm: '', category: 'all'}

所以为了发送这个我已经尝试过了：

const {
        data: recipes,
        error,
        isLoading,
    } = useGetRecipesQuery({
        searchTerm: filter.searchTerm,
        category: filter.category,
    });

和

... 
= useGetRecipesQuery({
        ...filter
    });

和

= useGetRecipesQuery(filter);

但无论我尝试什么，在快速路线上：

console.log(req.query.filter.searchTerm, req.query.filter.category);

我得到：未定义未定义

如何在

req

中获取这些值？

Answer 1

我怀疑

filter

对象正在 Request 对象中被字符串化。您可以展平您发送的参数，以便它们作为单独的搜索参数传递，例如

"/api/recipes?searchTerm=&category=all"

。

getRecipes: builder.query({
  query: (filter) => ({
    url: "/api/recipes",
    params: filter, // { searchTerm: '', category: 'all' }
  }),
  providesTags: ["Recipes"],
}),

或

getRecipes: builder.query({
  query: (filter) => ({
    url: "/api/recipes",
    params: { ...filter }, // { searchTerm: '', category: 'all' }
  }),
  providesTags: ["Recipes"],
}),

或者更明确地说明所传递的内容：

getRecipes: builder.query({
  query: (filter) => ({
    url: "/api/recipes",
    params: {
      searchTerm: filter.searchTerm,
      category: filter.category,
    }, // { searchTerm: '', category: 'all' }
  }),
  providesTags: ["Recipes"],
}),