iview VueI18n国际化

最新推荐文章于 2024-05-07 19:30:18 发布

Closure999

最新推荐文章于 2024-05-07 19:30:18 发布

阅读量576

点赞数

分类专栏： vue iview

本文链接：https://blog.csdn.net/Xiaoxiao_Zheng/article/details/104994873

版权

需求：国际化

实现：

1 安装依赖

这里vue -i18n和iview版本兼容性查看iview官网

"view-design": "^4.0.2",
    "vue": "^2.6.10",
    "vue-i18n": "^8.15.4",

2 index.js

（1）文件配置也需要查看iview官网

（2）这里的写法适用iview组件按需引入的写法；

import Vue from 'vue';
import { locale } from 'view-design';
import VueI18n from 'vue-i18n';
import zh from 'view-design/dist/locale/zh-CN';
import en from 'view-design/dist/locale/en-US';
/**
 * 导入iview自带语言包
 */
Vue.use(VueI18n);
const messages = {
  en: Object.assign(require('./en')), // 英文语言包
  zh: Object.assign(require('./zh')), // 中文语言包
};

export const i18n = new VueI18n({
  // locale: localStorage.getItem('locale') || 'zh',
  locale: (() => {
    let lang = "";
    if (window.sessionStorage.getItem('language'