vue elementui 中使用国际化

辣子鸡丁上将

于 2018-07-30 18:29:54 发布

阅读量2.3k

点赞数 1

分类专栏： Vue 文章标签： vue

本文链接：https://blog.youkuaiyun.com/weixin_39205240/article/details/81289920

版权

本文介绍了如何在Vue项目中结合ElementUI实现国际化功能，包括创建i18n文件夹，设置index.js, en.js 和 zh.js，以及在main.js中的配置和使用方法。" 111372771,10295752,奥迪发布A2D2：大规模自动驾驶数据集,"['自动驾驶', '数据集', '传感器', '3D点云', '车辆总线']

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.定义i18n文件夹，并添加index.js,en.js,zh.js

index.js

import Vue from 'vue';
//引入vue-i18n cnpm i vue-i18n;
import VueI18n from 'vue-i18n';
import enElementLocale from 'element-ui/lib/locale/lang/en'
import zhElementLocale from 'element-ui/lib/locale/lang/zh-CN'
import enLocale from './en'
import zhLocale from './zh'
Vue.use(VueI18n);
const messages = {
    en:{
        ...enElementLocale,
        ...enLocale
    },
    zh:{
        ...zhElementLocale,
        ...zhLocale
    }
}
const i18n = new VueI18n({
    locale:localStorage.getItem('lang') || 'zh',
    messages
});
export default i18n;

en.js

export default{
    message:{
        'hello':'hello world',
    }
};

zh.js

export default{
    message:{
        'hello':'你好 世界',
    }
};

2.ma

最低0.47元/天解锁文章