Apollo useQuery传递locale变量对接Strapi v4的异常问题

问题现象 #

1. 硬编码Locale正常：直接在GraphQL查询中写死locale: "en"或"de"，能正常返回对应语言的内容，未翻译条目会自动返回默认语言内容。
2. 变量传递Locale报错：将Locale定义为String类型变量传递时（示例2），直接返回ApolloError: Response not successful: Received status code 400。
3. Filters传递Locale有局限：改用filters.locale.eq: $locale查询时，en能正常返回结果，但de会返回空数组，和硬编码de的结果不一致。

问题原因 #

1. 变量类型不匹配导致400错误 #

Strapi的GraphQL API中，顶级locale参数的类型是自定义枚举类型Locale，而非通用的String。硬编码字符串时，GraphQL会自动将其解析为对应的枚举值；但通过变量传递时，必须明确指定变量类型为Locale，否则会触发类型校验失败，返回400错误。

2. Filters查询无语言回退机制 #

Strapi的顶级locale参数内置了语言回退逻辑：当目标语言没有对应条目翻译时，会自动返回默认语言的内容。而使用filters.locale.eq查询时，只会严格匹配该语言的已翻译条目，未翻译的内容不会被返回，这就是查de返回空数组的核心原因。

解决方案 #

修复变量传递的400错误 #

将变量类型从String改为Strapi自动生成的Locale枚举类型即可：

export const GET_CATS = gql`
  query GetCategories($locale: Locale) {
    categories(locale: $locale) {
      data {
        id
        attributes {
          title
        }
      }
    }
  }
`;

export function useCategories() {
  const { data, loading, error } = useQuery(GET_CATS, {
    variables: { locale: 'en' },
    notifyOnNetworkStatusChange: true,
  });

  return { data, loading, error };
}

效果验证 #

传递locale: "de"时，会返回已翻译的德语内容，未翻译的条目会自动回退到默认语言内容，和硬编码locale: "de"的行为完全一致，同时保留了变量传递的灵活性。

关键区别对比 #

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