如何在i18n切换语言时动态修改Redux的baseQuery？

你的问题核心在于语言切换后，RTK Query的缓存数据没有自动刷新，导致请求仍然使用旧的baseUrl。以下是具体修复步骤：

1. 优化自定义baseQuery，直接使用i18n当前语言 #

把原来从AsyncStorage读取语言的逻辑改为直接调用i18n的当前语言，能更及时获取最新的语言设置：

const customBaseQuery = async (url, options) => {
  // 直接从i18n获取当前语言，无需重复读取AsyncStorage
  const language = i18n.language === 'en' ? 'en' : 'ru';
  const baseUrl = `http://oralbekov.dias19.fvds.ru/${language}`;
  return fetchBaseQuery({ baseUrl })(url, options);
};

2. 语言切换时手动失效所有API缓存标签 #

在完成语言切换操作后，调用RTK Query的invalidateTags方法，让所有关联的查询重新发起请求，从而使用新的baseUrl：

// 示例语言切换函数
const switchLanguage = async (targetLang) => {
  // 更新存储和i18n配置
  await AsyncStorage.setItem('Language', targetLang === 'en' ? '1' : '0');
  await i18n.changeLanguage(targetLang);
  
  // 失效所有API查询的缓存标签，触发重新请求
  apiSlice.util.invalidateTags([
    'PopularQuestions',
    'CategoryQuestion',
    'QuestionsCategory',
    'CategoryTheory',
    'CategoryTheoryArticle',
    'Articles',
    'ArticleById',
    'HajjDays',
    'HajjStartDate',
    'UmrahDays',
    'Translate',
    'CategoryQuestions',
  ]);
};

3. 可选：监听i18n语言变化事件自动刷新 #

如果希望语言切换时自动触发缓存失效，可以在根组件或store相关组件中添加监听：

useEffect(() => {
  const handleLangChange = () => {
    apiSlice.util.invalidateTags([
      'PopularQuestions',
      'CategoryQuestion',
      'QuestionsCategory',
      'CategoryTheory',
      'CategoryTheoryArticle',
      'Articles',
      'ArticleById',
      'HajjDays',
      'HajjStartDate',
      'UmrahDays',
      'Translate',
      'CategoryQuestions',
    ]);
  };

  i18n.on('languageChanged', handleLangChange);
  // 组件卸载时移除监听
  return () => i18n.off('languageChanged', handleLangChange);
}, []);

关于apiSlice.updateBaseQuery无效的原因 #

updateBaseQuery确实可以替换baseQuery函数，但它不会自动清除已有的查询缓存。即使替换了新的baseQuery，已缓存的结果依然会被使用，直到缓存失效或被手动清除。因此必须配合invalidateTags触发重新请求，才能让新的baseUrl生效。

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