您好,欢迎来到码863代码分享网! 请[登录] / [注册]

uniapp多语言实现

编辑


打包国际化处理,主要是引导用户的提示语,如申请权限等   https://ask.dcloud.net.cn/article/35860



uni-app全方位多语言  https://ask.dcloud.net.cn/article/35872




我的项目是直接在HBuilderX 创建的,所以需要使用npm init -y 初始化package.json文件

npm init -y

安装vue-i18n 命令如下

npm i vue-i18n

\lang.js

export default {
    'en-US': {    
      index: {    
        invite: 'Invite',    
        game: 'Game'    
      }    
    },    
    'zh-CN': {    
      index: {    
        invite: '邀请',    
        game: '游戏'    
      }    
    }
}

\main.js

import Vue from 'vue'    
import App from './App'
import messages from './lang'   
import VueI18n from 'vue-i18n'    

Vue.use(VueI18n)    

const i18n = new VueI18n({    
  locale: 'en-US',    
  messages
})    

Vue.prototype._i18n = i18n    
Vue.prototype.$i18nMsg = function(){  
    return i18n.messages[i18n.locale]  
}  

const app = new Vue({    
  i18n,    
  ...App    
})    
app.$mount()


\pages\index\index.vue

<template>  
    <view>  
        <view>{{ i18n.index.invite }}</view>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                title: 'Hello'  
            }  
        },  
        computed: {  
            i18n() {  
                return this.$i18nMsg()  
            }  
        },  
        onLoad() {  
            setTimeout(() => {  
                this.$i18n.locale = 'zh-CN'  
            },2000)  
        },  
        methods: {  

        }  
    }  
</script>  

<style rel="stylesheet/stylus">  
    .content-title  
        color #500778  
</style>


CopyRight 2002~2023 精通2100网 联系邮箱:qqtxt@163.com
版权所有:精通2100网 湘ICP备2023018646号-1
MYSQl共执行 3 个查询,用时 0.002161979675293 秒,PHP脚本用时 0.004347 秒,占用内存 0.512 MB,Gzip 已启用