首页 > 其他分享 >uniapp中使用i18n

uniapp中使用i18n

时间:2023-07-30 15:55:05浏览次数:33  
标签:uniapp zh index locale js 使用 i18n import

1.安装vue-i18n 

2.根目录下新建locale文件夹,创建index.js

import { createI18n } from 'vue-i18n'

import en from './en.json'   //locale文件夹下的英文配置
import zh from './zh.json'   //中文配置
import zhFan from './zh-fan.json'  //繁体配置

const messages = {
    en,
    'zh-Hans': zh,
    'zh-Hant': zhFan
}
const i18n = createI18n({
    locale: uni.getLocale('lang') || 'zh-Hans',
    messages
})

export default i18n

然后在main.js里导入 import i18n from '@/locale/index.js'  app.use(i18n)

3.使用

     ①在view标签里使用,如   {{ $t('index.login') }}   

     ②在属性上使用,如   :placeholder="$t('index.login')"

     ③在js代码中使用

        首先引入import i18n from '../locale/index.js' (路径根据自己项目而定)

        

uni.showModal({
   content: i18n.global.t('index.login'),
   showCancel: false
})

let name = ref(i18n.global.t('index.login'))
let arr = reactive([
{
label: i18n.global.t('index.login'),
    value: 0
  }
])

 

4.设置语言

简体: zh-Hans  繁体:zh-Hant 英文:en

选择好语言后通过 uni.setLocale(val) 来改变语言  如果要在某个页面获取当前语言 可使用uni.getLocale() 或者选择好语言后存入session 从session中取(uniapp是存入localStorage里)

标签:uniapp,zh,index,locale,js,使用,i18n,import
From: https://www.cnblogs.com/reround/p/17591550.html

相关文章

  • F5 LTM 知识点和实验 6-使用虚拟服务器处理流量
    第六章:使用虚拟服务器处理流量virtualserver类型前几章描述的场景,可以简单总结为,F5设备终结了一个会话,在client-side充当服务端,在server-side充当客户端,完成了一个全代理过程,这种模型的vs类型被称为标准类型。一般在你需要将流量做负载等场景时需要。但是你也许不需要对流量做......
  • C# 使用SIMD向量类型加速浮点数组求和运算(4):用引用代替指针, 摆脱unsafe关键字,兼谈Unsa
    作者:zyl910目录一、引言二、办法说明2.1历史2.2局部引用变量与引用所指的值(类似指针的地址运算符&、间接运算符*)2.3重新分配局部引用变量(类似指针直接赋值)2.4引用地址调整(类似指针加减法)2.5引用地址比较(类似指针比较)2.6重新解释(类似C++的reinterpret_cast)2.7引用取消只......
  • java使用线程池实现接口自动化中的并发测试
    importjava.util.concurrent.ExecutionException;importjava.util.concurrent.ExecutorService;importjava.util.concurrent.Executors;importjava.util.concurrent.Future;publicvoidtest()throwsExecutionException,InterruptedException{ExecutorServ......
  • Kafka集群安装/使用
    一.介绍Kafka是Apache旗下的一款分布式流媒体平台,Kafka是一种高吞吐量、持久性、分布式的发布订阅的消息队列系统。它最初由LinkedIn(领英)公司发布,使用Scala语言编写,与2010年12月份开源,成为Apache的顶级子项目。它主要用于处理消费者规模网站中的所有动作流数据。动作指(网页浏......
  • [翻译] 如何在 Node.js 中使用 OpenAI 的 ChatGPT API
    人工智能(AI)一直在彻底改变我们与技术交互的方式,而聊天机器人是这一趋势最突出的例子之一。随着对能够理解自然语言并提供有用响应的聊天机器人的需求不断增加,OpenAI的ChatGPTAPI已成为开发人员的热门选择。在这篇博文中,我们将探讨如何在Node.js(一种用于构建Web应用......
  • chatGPT回答的,关于使用USB引导,使用WDS安装操作系统的提示:
    理解网络引导WDS安装windows操作系统么? 当然,我可以帮助您理解以网络引导(WindowsDeploymentServices,即WDS)安装Windows操作系统的基本过程。WindowsDeploymentServices是一种让管理员远程安装Windows操作系统的工具,这样可以在域环境中快速地为多个系统进行操作......
  • 3-2 编写一个函数 escape(s, t),将字符串 t 复制到字符串 s 中,并在复制 过程中将换行
    ArchlinuxGCC13.1.1 202304292023-07-3012:57:46星期日 点击查看代码#include<stdio.h>voidescape(chars[],chart[]){inti,j;i=j=0;while(t[i]!='\0'){switch(t[i]){case�......
  • CDP7环境下使用SparkSQL Shell方式
    相信很多在用CDP7的小伙伴都遇到了Spark里面不再支持spark-sql的问题这里给出两种解决方案:spark-submit与spark-shellcloudera官方给的解决方案https://docs.cloudera.com/cdp-private-cloud-base/7.1.5/developing-spark-applications/topics/spark-sql-example.html基于这个方案,......
  • 7_Spring_使用外部属性配置文件
    7_Spring_使用外部属性配置文件spring容器可以读取.properties属性配置文件,可以将文件中的信息注入给bean例如,引入Druid数据源,配置连接池信息1 导入Druid依赖和mysql-connector依赖<dependency><groupId>com.alibaba</groupId><artifa......
  • 14_Spring_JDBCTemplate的使用
    14_Spring_JDBCTemplate的使用JdbcTemplate概述JdbcTemplate是spring框架中提供的一个对象,是对原始繁琐的JdbcAPI对象的简单封装。spring框架为我们提供了很多的操作模板类。例如:操作关系型数据的JdbcTemplate和,操作nosql数据库的RedisTemplate,操作消息队列的JmsTemplate等等......