home.js
const data = {ZH: {content1: "苹果",},EN: {content1: “Apple”,}
}
export default dataindex.js
import home from "./home.js"
export default {home
}
en.js
import part1 from './data/part1/index.js'
const en = {language: {name: "english"},part1: {home: {content1: part1.home.EN.content1,}}
}
export default en
zh.js
import part1 from './data/part1/index'
const zh = {language: {name: "中文"},part1: {home: {content1: part1.home.ZH.content1,},},
}
export default zh
使用
{{$t("part1.home.content1")}}
页面标题
onShow: function() {uni.hideHomeButton();if (this.$i18n.locale == 'en') {uni.setNavigationBarTitle({title: 'Home Page'});} else {uni.setNavigationBarTitle({title: '首页'});}},
main.js
import ZH from '@/language/zh.js' //中文最终汇总暴露的信息
import EN from '@/language/en.js' //英文
import VueI18n from 'vue-i18n'
Vue.use(VueI18n)
const i18n = new VueI18n({// localStorage.getItem('languageSet') || 'zh'locale: 'zh', //从localStorage里获取用户中英文选择，没有则默认中文messages: {'zh': ZH,'en': EN}
})const app = new Vue({i18n,store,...App
})
使用
<u-button size="medium" type='primary' @click="chagelanguage">{{ language }}</u-button>chagelanguage() {this.$i18n.locale == 'zh' ? this.$i18n.locale = 'en' : this.$i18n.locale = 'zh' //设置中英文模式if (this.$i18n.locale === 'zh') {this.language = "en"uni.setNavigationBarTitle({title: '首页'});uni.setTabBarItem({index: 0,text: '首页',})uni.setTabBarItem({index: 1,text: '我的',})} else {this.language = "zh"uni.setNavigationBarTitle({title: 'Home Page'});uni.setTabBarItem({index: 0,text: 'Home Page',})uni.setTabBarItem({index: 1,text: 'User',})}},
