如何通过RTK Query向Express后端传递对象参数

问题出在你RTK Query的参数传递方式上——你把整个filter对象嵌套在了params的filter键下，导致Express端无法正确解析到嵌套的属性。

修复方法一：直接展开filter参数（推荐） #

修改RTK Query中的query配置，把filter对象直接作为params的值，而不是嵌套在filter键里：

getRecipes: builder.query({
    query: (filter) => ({
        url: "/api/recipes",
        params: filter, // 直接传递filter对象，而非{ filter }
    }),
    providesTags: ["Recipes"],
}),

之后在Express路由里直接从req.query获取对应字段：

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

修复方法二：保留嵌套结构（不推荐） #

如果你一定要保留filter作为嵌套参数，需要确认Express的查询参数解析器能处理嵌套结构（Express默认用qs库，原生支持）。此时你在RTK Query里的写法不变，但要注意axios会把嵌套对象序列化为filter[searchTerm]=xxx&filter[category]=xxx的形式，Express会自动解析为req.query.filter对象。如果还是拿不到，检查你的Express是否修改了默认的query parser配置，或者手动用qs解析：

const qs = require('qs');
const filter = qs.parse(req.query.filter);
console.log(filter.searchTerm, filter.category);

不过第一种方法更简洁，符合REST API的常规参数传递方式。

内容的提问来源于stack exchange，提问作者jukenduit