原生js实现多语言切换

1.select实现语言选择

中文
language
Язык
Тіл

2.value发生改变调用方法，通过值的不同调用不同html页面
function changelanguage(){
var myselect=document.getElementById(“test”);
var index=myselect.selectedIndex;
var value=myselect.options[index].value;
//判断语言的类型
if (value == ‘Chinese’) {
window.location = ‘Chinese.html’;
} else if(value == ‘English’){
window.location = ‘English.html’;
}else if(value == ‘Russian’){
window.location = ‘Russian.html’
}else{
window.location = ‘Kazakh.html’
}
}
------------------------以上为原生js使用多个html页面切换语言-----------------------------
基于vue框架实现国际化语言切换
1.安装i8n,npm install vue-i18n --save-dev
2.注册i18n,
import VueI18n from ‘vue-i18n’ //引入 vue-i18n
Vue.use(VueI18n); //通过插件的形式挂载
3使用语言包
/---------使用语言包-----------/
const i18n = new VueI18n({
locale: ‘zh’, // 语言标识
//this.KaTeX parse error: Expected 'EOF', got '}' at position 168: …英文语言包 } }̲) 4.挂载不能丢 …i18n.locale = ‘zh’
console.log(this.KaTeX parse error: Expected 'EOF', got '}' at position 21: …locale); }̲ else{ …i18n.locale = ‘ru’
console.log(this.KaTeX parse error: Expected 'EOF', got '}' at position 21: …locale); }̲ // val …t(‘message.zh’), value: 0});
// Vue.set(this.lang, 1, {label: this.KaTeX parse error: Expected 'EOF', got '}' at position 26: ….en'), value: 1}̲) } 7.三…t(‘message.zh’)}}

	//vue组件模板数据绑定的使用
	<input :placeholder="$t('message.zh')"></input>
	
	//vue组件data中赋值的使用
	data:{
	   msg:this.$t('message.zh');
	}