码迷,mamicode.com
首页 > 其他好文 > 详细

vue-i18n 的用法

时间:2018-08-31 00:28:07      阅读:1859      评论:0      收藏:0      [点我收藏+]

标签:locale   ons   必须   语言   itil   开发   注册   code   lang   

主要用于网站国际化,开发可以切换多语言的网站

1,安装

npm install vue-i8n

2,在main.js中引入和注册

import VueI18n from ‘vue-i18n‘
import cn from ‘./lang/cn.js‘
import en from ‘./lang/en.js‘

Vue.use(VueI18n)

//实例化
const i18n = new VueI18n({
   locale:‘cn‘,   //默认语言
   message:{   //引用语言包
   cn:cn,
   en:en 
}  
})


const app = new Vue({
    router,
    i18n,  //挂到vue上
    ...App
}).$mount(‘#app‘)

语言包就是单独建一个js文件,用来放一种语言的数据,例如:

//cn.js

export default {
  titile:‘标题‘  
}


//en.js
export default {
  titile:‘title‘  
}

//在页面上使用
<template>
<div>{{$t(‘title‘)}}</div>           //必须用$t(),才能访问到
</template>

切换语言就是改变locale的值就行,在组件中可以用this.$i18n.locale来改变对应的语言

vue-i18n 的用法

标签:locale   ons   必须   语言   itil   开发   注册   code   lang   

原文地址:https://www.cnblogs.com/haqiao/p/9563340.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!