i18n.changeLanguage('zh') 不可以放入actions中去处理吗?
来源:9-9 【中间件】自定义中间件 actionLog

匆匆又夏天丶
2021-03-13
我尝试放入action
中去处理,代码如下:
export const changeLanguageActionCreator = (
languageCode: 'zh' | 'en'
): ThunkAction<void, TRootState, unknown, IChangeLanguageAction> => {
return (dispatch, state) => {
i18n.changeLanguage('zh')
dispatch({
type: CHANGE_LANGUAGE,
payload: 'zh'
})
}
}
不知为何在类组件Header.class.tsx
中会报错,在函数式组件Header.tsx
中没有如下问题,排查发现是mapDispatchToProps
中对dispatch
类型注解成Dispatch
类型造成的
const mapDispatchToProps = (dispatch: Dispatch) => {
return {
changeLanguage(code: 'zh' | 'en') {
dispatch(changeLanguageActionCreator(code))
},
addLanguage(name: string, code: string) {
const action = addLanguageActionCreator(name, code)
dispatch(action)
}
}
}
想问下老师如果我想在这处理i18是否合理,如果合理,那么这个ts的类型错误问题我该如何解决呢?套的深的类型我就看不懂了,出现错误的问题应该是上文中提到的。
写回答
1回答
-
阿莱克斯刘
2021-03-14
使用thunk action来处理i18n切换有一定的合理性,因为i18n切换会引起副作用。但是thunk更多的是用来处理异步逻辑的,而i18切换并不存在异步逻辑,所以其实放在thunk action中有点高射炮打蚊子的感觉。
不过我觉得你已经快抓到要点了,你可以尝试在中间件中处理i18n的切换。
00
相似问题
关于onClick事件处理函数的问题
回答 1
关于语言切换
回答 1