zoukankan      html  css  js  c++  java
  • 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')

         }

  • 相关阅读:
    unnitest简单场景应用
    接口基础之request
    docker常用命令
    管理之心理学
    管理团队挑战和提升
    如何留下核心成员
    管理之面试技巧
    复杂接口请求怎样写http请求
    gitlab使用(一)
    不使用AutoLayout快速兼容适配iPhone6/6 Plus
  • 原文地址:https://www.cnblogs.com/daijing/p/10407694.html
Copyright © 2011-2022 走看看