vue+element-ui國際化(i18n)


1、 下載element-ui和vue-i18n: 

   npm i element-ui --save   npm i vue-i18n –save

2、  創建一個  i18n 文件夾,

  

  

 

  在main.js 中導入i18n,掛在到vue實例中區;

       注意: 在en.js或者zh-cn.js中,可以將message中的幾個屬性合成一個,如上面的linkWords。

3、使用語言

  直接在使用的地方 $t(‘message.key’)  ;

    <p>{{$t('message.hello')}}</p>

       或者使用  v-t=”{ path: ‘message.hello’ }”         效果和上面相同

    <p v-t="{ path: 'message.poem'}"></p>

  ,並且可以傳值

   

4、切換語言環境

  給按鈕注冊事件,事件中切換this.$i18n.locale = ‘  ’ 的值為相應的語言值即可。

  switchChinese(){

       this.$i18n.locale = 'zh';

    window.localStorage.setItem('qinLang','zh')

     },

     switchEnlish(){

        this.$i18n.locale = 'en';

        window.localStorage.setItem('qinLang','en')

     }


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM