Redux Query Hook出现unique symbol类型不匹配错误求助

问题根源 #

你定义的getTheme端点查询参数类型是string | undefined，但调用useGetThemeQuery时传递的是包含id属性的对象（{ id }），而钩子期望接收的是单个值（string | undefined | unique symbol），这直接导致了类型不兼容。

修复步骤 #

1. 传递原始参数值而非对象
   将组件中的调用代码修改为直接传入id：

   // 错误写法
   // const { data } = useGetThemeQuery({ id });
   // 正确写法
   const { data } = useGetThemeQuery(id);
   

2. 优化：处理id为undefined的场景
   当id不存在时，直接发起请求会生成无效URL（themes/undefined），可以添加条件判断避免这种情况：

   const AllProjects = () => {
     const { id } = useParams();
   
     // 若id不存在，先渲染提示或跳过请求
     if (!id) {
       return <div>缺少主题ID参数</div>;
     }
   
     // 仅当id存在时发起请求
     const { data } = useGetThemeQuery(id);
     return (
       <div>
         {data?.map((project) => (
           <p>{project.type}</p>
         ))}
       </div>
     );
   };
   

   或者在端点定义中处理空参数：

   getTheme: build.query<Array<Project>, string | undefined>({
     query: (theme) => {
       // 若theme为undefined，请求默认路径或返回合法配置
       return theme ? `themes/${theme}` : '/themes';
     },
     providesTags: ["Themes"],
   }),
   

关于unique symbol的说明 #

报错中提到的unique symbol是RTK Query内置的特殊类型，用于传递skipToken来跳过请求（比如useGetThemeQuery(skipToken)），和你的参数类型不冲突，核心问题还是传递了错误的参数格式。

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