ant design vue pro设置默认语言为中文
1. 修改src/core/bootstrap.js第29行改成30行
1 import store from '@/store' 2 import storage from 'store' 3 import { 4 ACCESS_TOKEN, 5 APP_LANGUAGE, 6 TOGGLE_CONTENT_WIDTH, 7 TOGGLE_FIXED_HEADER, 8 TOGGLE_FIXED_SIDEBAR, TOGGLE_HIDE_HEADER, 9 TOGGLE_LAYOUT, TOGGLE_NAV_THEME, TOGGLE_WEAK, 10 TOGGLE_COLOR, TOGGLE_MULTI_TAB 11 } from '@/store/mutation-types' 12 import { printANSI } from '@/utils/screenLog' 13 import defaultSettings from '@/config/defaultSettings' 14 15 export default function Initializer () { 16 printANSI() // 请自行移除该行. please remove this line 17 18 store.commit(TOGGLE_LAYOUT, storage.get(TOGGLE_LAYOUT, defaultSettings.layout)) 19 store.commit(TOGGLE_FIXED_HEADER, storage.get(TOGGLE_FIXED_HEADER, defaultSettings.fixedHeader)) 20 store.commit(TOGGLE_FIXED_SIDEBAR, storage.get(TOGGLE_FIXED_SIDEBAR, defaultSettings.fixSiderbar)) 21 store.commit(TOGGLE_CONTENT_WIDTH, storage.get(TOGGLE_CONTENT_WIDTH, defaultSettings.contentWidth)) 22 store.commit(TOGGLE_HIDE_HEADER, storage.get(TOGGLE_HIDE_HEADER, defaultSettings.autoHideHeader)) 23 store.commit(TOGGLE_NAV_THEME, storage.get(TOGGLE_NAV_THEME, defaultSettings.navTheme)) 24 store.commit(TOGGLE_WEAK, storage.get(TOGGLE_WEAK, defaultSettings.colorWeak)) 25 store.commit(TOGGLE_COLOR, storage.get(TOGGLE_COLOR, defaultSettings.primaryColor)) 26 store.commit(TOGGLE_MULTI_TAB, storage.get(TOGGLE_MULTI_TAB, defaultSettings.multiTab)) 27 store.commit('SET_TOKEN', storage.get(ACCESS_TOKEN)) 28 29 // store.dispatch('setLang', storage.get(APP_LANGUAGE, 'en-US')) 30 store.dispatch('setLang', storage.get(APP_LANGUAGE, 'zh-CN')) 31 // last step 32 }
2.修改src/locales/index.js第7行改成8、12行改成13、16行改成23
1 import Vue from 'vue' 2 import VueI18n from 'vue-i18n' 3 import storage from 'store' 4 import moment from 'moment' 5 6 // default lang 7 // import enUS from './lang/en-US' 8 import enUS from './lang/zh-CN' 9 10 Vue.use(VueI18n) 11 12 // export const defaultLang = 'en-US' 13 export const defaultLang = 'zh-CN' 14 15 // const messages = { 16 // 'en-US': { 17 // ...enUS 18 // } 19 // } 20 21 22 const messages = { 23 'zh-CN': { 24 ...enUS 25 } 26 } 27 28 const i18n = new VueI18n({ 29 silentTranslationWarn: true, 30 locale: defaultLang, 31 fallbackLocale: defaultLang, 32 messages 33 }) 34 35 const loadedLanguages = [defaultLang] 36 37 function setI18nLanguage (lang) { 38 i18n.locale = lang 39 // request.headers['Accept-Language'] = lang 40 document.querySelector('html').setAttribute('lang', lang) 41 return lang 42 } 43 44 export function loadLanguageAsync (lang = defaultLang) { 45 return new Promise(resolve => { 46 // 缓存语言设置 47 storage.set('lang', lang) 48 if (i18n.locale !== lang) { 49 if (!loadedLanguages.includes(lang)) { 50 return import(/* webpackChunkName: "lang-[request]" */ `./lang/${lang}`).then(msg => { 51 const locale = msg.default 52 i18n.setLocaleMessage(lang, locale) 53 loadedLanguages.push(lang) 54 moment.updateLocale(locale.momentName, locale.momentLocale) 55 return setI18nLanguage(lang) 56 }) 57 } 58 return resolve(setI18nLanguage(lang)) 59 } 60 return resolve(lang) 61 }) 62 } 63 64 export function i18nRender (key) { 65 return i18n.t(`${key}`) 66 } 67 68 export default i18n
3.修改src/store/modules/app.js第32行改成33行
1 import storage from 'store' 2 import { 3 SIDEBAR_TYPE, 4 TOGGLE_MOBILE_TYPE, 5 TOGGLE_NAV_THEME, 6 TOGGLE_LAYOUT, 7 TOGGLE_FIXED_HEADER, 8 TOGGLE_FIXED_SIDEBAR, 9 TOGGLE_CONTENT_WIDTH, 10 TOGGLE_HIDE_HEADER, 11 TOGGLE_COLOR, 12 TOGGLE_WEAK, 13 TOGGLE_MULTI_TAB, 14 // i18n 15 APP_LANGUAGE 16 } from '@/store/mutation-types' 17 import { loadLanguageAsync } from '@/locales' 18 19 const app = { 20 state: { 21 sideCollapsed: false, 22 isMobile: false, 23 theme: 'dark', 24 layout: '', 25 contentWidth: '', 26 fixedHeader: false, 27 fixedSidebar: false, 28 autoHideHeader: false, 29 color: '', 30 weak: false, 31 multiTab: true, 32 // lang: 'en-US', 33 lang: 'zh-CN', 34 _antLocale: {} 35 }, 36 mutations: { 37 [SIDEBAR_TYPE]: (state, type) => { 38 state.sideCollapsed = type 39 storage.set(SIDEBAR_TYPE, type) 40 }, 41 [TOGGLE_MOBILE_TYPE]: (state, isMobile) => { 42 state.isMobile = isMobile 43 }, 44 [TOGGLE_NAV_THEME]: (state, theme) => { 45 state.theme = theme 46 storage.set(TOGGLE_NAV_THEME, theme) 47 }, 48 [TOGGLE_LAYOUT]: (state, mode) => { 49 state.layout = mode 50 storage.set(TOGGLE_LAYOUT, mode) 51 }, 52 [TOGGLE_FIXED_HEADER]: (state, mode) => { 53 state.fixedHeader = mode 54 storage.set(TOGGLE_FIXED_HEADER, mode) 55 }, 56 [TOGGLE_FIXED_SIDEBAR]: (state, mode) => { 57 state.fixedSidebar = mode 58 storage.set(TOGGLE_FIXED_SIDEBAR, mode) 59 }, 60 [TOGGLE_CONTENT_WIDTH]: (state, type) => { 61 state.contentWidth = type 62 storage.set(TOGGLE_CONTENT_WIDTH, type) 63 }, 64 [TOGGLE_HIDE_HEADER]: (state, type) => { 65 state.autoHideHeader = type 66 storage.set(TOGGLE_HIDE_HEADER, type) 67 }, 68 [TOGGLE_COLOR]: (state, color) => { 69 state.color = color 70 storage.set(TOGGLE_COLOR, color) 71 }, 72 [TOGGLE_WEAK]: (state, mode) => { 73 state.weak = mode 74 storage.set(TOGGLE_WEAK, mode) 75 }, 76 [APP_LANGUAGE]: (state, lang, antd = {}) => { 77 state.lang = lang 78 state._antLocale = antd 79 storage.set(APP_LANGUAGE, lang) 80 }, 81 [TOGGLE_MULTI_TAB]: (state, bool) => { 82 storage.set(TOGGLE_MULTI_TAB, bool) 83 state.multiTab = bool 84 } 85 }, 86 actions: { 87 setLang ({ commit }, lang) { 88 return new Promise((resolve, reject) => { 89 commit(APP_LANGUAGE, lang) 90 loadLanguageAsync(lang).then(() => { 91 resolve() 92 }).catch((e) => { 93 reject(e) 94 }) 95 }) 96 } 97 } 98 } 99 100 export default app
4.因为该框架语言存在了本地,所以只要清楚本地即可
清除本地:
重新登录即可。
转载:https://blog.csdn.net/qq2942713658/article/details/118782281