1. 程式人生 > >vue-router 和 vue-i18n 在router中實現國際化

vue-router 和 vue-i18n 在router中實現國際化

今天遇到個需求,需要在router中實現國際化,試了半天發現 router 和 i18n 是同級的,在router中呼叫this.$t()會報錯,那麼我們可以換種思路:
在我的翻譯檔案中寫好需要翻譯的key,替換路由中的title,在用到title的地方使用i18n進行國際化,如下
1) 在zh.js 和 en.js中分別寫好key:
這裡寫圖片描述
2) 在router中的title位置進入該key
這裡寫圖片描述
3) 在使用該路由title的地方使用i18n {{$t(item.name)}}進行國際化
這裡寫圖片描述