vue-language v1.0.1

• 作用
  • vue项目中简单的切换语言
  • 不能够切换elementUI自带的组件内部语言,像日期控件、分页控件等
• 使用
• npm install vue-language

• src下新建utils目录新建language目录新建index.js

  import zh from './zh.json'
  import en from './en.json'
  import {init} from 'vue-language'
  
  const languages = {
  	zh,
  	en,
  	
  	
  }
  let language = new init(languages,zh).initLanguage();
  
  
  export {
  	language
  }

• language下目录新建用于测试的json文件

  • zh.json

  {
  	"msg":"你好"
  }

  • en.json

    {
    	"msg":"hello"
    }

• 在main.js引入

import {language} from './utils/language/index.js'

Vue.prototype.$lang = language;

• 在App.vue中使用

<template>
  <div id="app">
   
    <div>
      <el-button>{{msg.msg}}</el-button>
	  
	  <el-button @click="changeLang(1)">中文</el-button>
	  <el-button @click="changeLang(2)">English</el-button>
    </div>
  </div>
</template>

<script>
export default {
	data() {
		return {
			msg:{
				
			}
		}
	},
	mounted() {
		console.log(this.$lang)
	},
  methods: {
    
	changeLang(n){
		console.log(n);
		
		if(n==1){
			
			this.msg = this.$lang.setLanguage(this.$lang.languages.zh);
		}
		else{
			
			this.msg = this.$lang.setLanguage(this.$lang.languages.en);
		}
	}
  }
}
</script>