y***@163.com
y***@163.com
  • 发布:2024-03-15 11:19
  • 更新:2024-03-15 11:35
  • 阅读:85

无意中找到nvue国际化场景下每个nvue页面都需要引入VueI18n的解决方案

分类:nvue
// nvue 目前的国际化方案需要在每个页面单独引入uni-i18n,后续框架会抹平差异,抹平差异后和 vue 页面一样只需要在 main.js 中引入  
<script>  
  import {  
    initVueI18n  
  } from '@dcloudio/uni-i18n'  

  // const messages = {} 此处内容省略,和 vue 全局引入的写法一致  

  const { t } = initVueI18n(messages)  

  export default {  
    data() {  
      return {  
      }  
    }  
  }  
</script>  

这是官网推荐的方案,需要在每个nvue都有这段代码

今天发现我们其实可以在app.vue的onLaunch中把t挂载到uni下,类似 uni.$locale = t去挂载,然后在nvue页面内直接使用 uni.$locale('common.edit')

下面是app.vue的示例代码

<script>  
    import {  
        initVueI18n  
    } from '@dcloudio/uni-i18n';  
    import messages from '@/locale';  
    const {  
        t  
    } = initVueI18n(messages);  
    export default {  
        onLaunch: function() {  
            console.log('App Launch')  
            uni.$locale = t  
            uni.$language = uni.getLocale()  
        },  
        onShow: function() {  
            console.log('App Show')  
        },  
        onHide: function() {  
            console.log('App Hide')  
        },  
    }  
</script>  

<style lang="scss">  
</style>
0 关注 分享

要回复文章请先登录注册

y***@163.com

y***@163.com (作者)

回复 盖世英雄 :
纯nvue编译的
2024-03-15 11:35
盖世英雄

盖世英雄

nvue挂载不了吧。h5模式的nvue吧,那跟vue有什么区别呢
2024-03-15 11:34
y***@163.com

y***@163.com (作者)

当然官方工程师帮忙看看是否存在性能隐患
2024-03-15 11:20