vue-i18n安装和实现国际化，$t的用法

1.安装

?

1	yarn install vue-i18n

 也可以直接引入

?

1 2	<script src="https://unpkg.com/vue/dist/vue.js"></script> <script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script>

　　

2.使用

在src/main.js引入i18n

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32

// ie polyfill import '@babel/polyfill'   import Vue from 'vue' import App from './App.vue' import router from './router' import store from './store/' import i18n from './lang' import { VueAxios } from './utils/request'   // mock import './mock'   import bootstrap from './core/bootstrap' import './core/use' import './permission' // permission control import './utils/filter' // global filter   Vue.config.productionTip = false   // mount axios Vue.$http and this.$http Vue.use(VueAxios)   new Vue({   router,   store,   i18n,   created () {     bootstrap()   },   render: h => h(App) }).$mount('#app')

　　

使用$t方法实现国际化

?

1	<span>{{ $t('header.HeadMenu.logout') }}</span>

　　或者用v-text

?

1	<span v-text="$t('header.HeadMenu.logout')"></span>