关于如何处理i18n

Question

老师是不是创建一个中间件，然后判断当前action的type，满足类型执行changeLanguage的操作？还有更好的方法吗？

import { Middleware } from "redux";
import i18n from "i18next";
import {CHANGE_LANGUAGE} from "../language/languageActions"

export const actionLanguage:Middleware = (store) => (next) => (action) => {
  if(action.type === CHANGE_LANGUAGE){
    i18n.changeLanguage(action.payload);
  }
  next(action)
};

Answer 1

阿莱克斯刘 2021-03-10 14:17:44

问题非常好。是的，理论上应该通过中间件来实现对i18n的操作，因为i18n的操作产生了副作用。但是用中间件来控制i18n比较麻烦，代码也很凌乱。所以，其实我们还是可以借助其他的第三方库来完成，比如说redux-i18n、再比如说react-redux-i18n。课程之所以没有介绍这两个插件的第一个原因是，希望同学可以自己思考一下如何控制副作用、第二个原因是这两个库还是有一定的争议。不过你能想到这个程度，并且能代码实现出来就以及很不错了。

• 提问者 mc浅 #1

  非常感谢！