# vue-i18n

**Repository Path**: uyghurjava/vue-i18n

## Basic Information

- **Project Name**: vue-i18n
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2017-05-22
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# vue-i18n

Internationalization plugin of VueJS 1.x. 
[Live demo](http://jinzhe.github.io/vue-i18n/)

# How to use?

1.Import plugin in your entry app.js.
```
import VueI18n from './vue-i18n.js'
import VueI18nData from './i18n.js'
Vue.use(VueI18n, VueI18nData)
```
2.Configure language packs
```
export default {
	default: 'cn',
	data: {
		cn: {
			name:"金哲",
			menu:{
			    goods:"商品管理",
			    order:"订单管理",
			}
		},
		en: {
			name:"ZEE.KIM",
			menu:{
			    goods:"GOODS",
			    order:"ORDER",
			}
		},
	}
}
```
3.Write some code to init in app.vue.
```
<template>
<div>
	<span v-i18n="{value:'name',language:language}"></span>
	<span v-i18n="{value:'menu.goods',language:language}"></span>
	<span v-i18n="{value:'menu.order',language:language}"></span>
	<input type="text" v-i18n.placeholder="{value:'placeholder',language:language}">
	<div v-i18n="{value:'replace',replace:[9,'admin'],language:language}"></div>
	<button @click="changeLanguage('cn')">中文</button>
	<button @click="changeLanguage('en')">EN</button>
</div>
</template>
<script>
export default {
	data() {
		return {
			language: this.$language,
		}
	},
	created() {
		// Acceptance speech signal change
		this.$on('language', type => {
			this.language = type
		})
	},
	methods:{
		// Change language when you click button
        changeLanguage(type){
            this.$root.$broadcast('language',type)
            this.$dispatch('language',type)
        },
	}
}
</script>
```
# Conatct

- Tencent QQ Group: 240319632
- E-mail: 129@jinzhe.net