uniapp实现后端数据i18n国际化

1.在main.js配置请求获取到数据再设置到i18n中,

我这里是通过后端接口先获取到一个多个数据的的json链接,通过链接再获取数据,拿到数据后通过遍历的方式设置i18n

//接口数据示例:{"vi": "http://localhost:8899/_data/storage/languages/vi.json","zh_CN": "http://localhost:8899/_data/storage/languages/zh_CN.json","pt": "http://localhost:8899/_data/storage/languages/pt.json"
}

main.js

import App from './App'
import { getLanguageJson } from "@/api/index.js";// 初始化一个对象来存储语言数据
const i18nData = {};// 设置 i18n 配置
const i18nConfig = {locale: uni.getLocale(), // 获取当前设备语言messages: uni.getStorageSync("i18nData") || {}, // 从缓存获取语言数据silentTranslationWarn: true,missingWarn: false,silentFallbackWarn: true,fallbackWarn: false
};// 异步加载所有语言文件
const loadLanguages = async () => {try {const res = await getLanguageJson();const obj = res.data;console.log(obj);// 使用 Object.entries 生成语言文件请求的 Promise 数组const promises = Object.entries(obj).map(([lang, url]) => new Promise((resolve) => {uni.request({url: url,method: 'GET',success: (res) => {if (res.statusCode === 200 && res.data) {i18nData[lang] = res.data;console.log(`语言包 ${lang} 加载成功`);} else {console.error(`语言包 ${lang} 加载失败`);i18nData[lang] = {}; // 设置为空对象以避免错误}resolve();},fail: (err) => {console.error(`语言包 ${lang} 加载失败`, err);i18nData[lang] = {}; // 设置为空对象以避免错误resolve();}});}));// 等待所有 Promise 完成await Promise.all(promises);// 加载完语言包后保存到本地缓存uni.setStorageSync("i18nData", i18nData);} catch (error) {console.error("获取语言包列表失败", error);}
};// #ifdef VUE3import { createSSRApp } from 'vue'import { createI18n } from 'vue-i18n'var i18n = createI18n(i18nConfig);// 拿到数据后加载语言包loadLanguages().then(() => {Object.entries(i18nData).forEach(([lang, messages]) => {i18n.global.setLocaleMessage(lang, messages);console.log(`语言包 ${lang} 加载成功`);});});export function createApp() {const app = createSSRApp(App);app.use(i18n);return {app};}// #endif

2.uniapp内置的文本语言无法通过异步国际化,只能在根目录locale文件夹下提前配置好。

├── locale
│ ├── en.json
│ ├── zh-Hans.json
│ └── zh-Hant.json

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/66105.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

关于Flutter应用国际化语言的设置

目录 1. Locale配置 2. 用户切换/启动自动加载缓存里面的locale 由于最近在开发app国际化设置的时候遇到一些问题,所以做出一些总结。 1. Locale配置 具体的初始化配置可以参考文档:i18n | Flutter 中文文档 - Flutter 中文开发者网站 - Flutter 值得…

基层医联体医院患者历史检验检查数据的快速Python编程分析

​​​​​​​ 一、引言 1.1 研究背景与意义 在当今数字化医疗时代,医疗数据呈爆炸式增长,涵盖患者的基本信息、病史、检验检查结果、治疗方案等各个维度。这些海量且复杂的数据蕴含着巨大价值,为精准医疗决策提供了关键依据。通过对患者历史检验检查数据的深入对比分析…

如何使用OpenCV进行抓图-多线程

前言 需求: 1、如何使用OpenCV捕抓Windows电脑上USB摄像头的流、 2、采用多线程 3、获知当前摄像头的帧率。 这个需求,之前就有做了,但是由于出现了一个问题,人家摄像头的帧率目前都可以达到60帧/s 了,而我的程序…

数势科技:解锁数据分析 Agent 的智能密码(14/30)

一、数势科技引领数据分析变革 在当今数字化浪潮中,数据已然成为企业的核心资产,而数据分析则是挖掘这一资产价值的关键钥匙。数势科技,作为数据智能领域的领军者,以其前沿的技术与创新的产品,为企业开启了高效数据分析…

C++11编译器优化以及引用折叠

1.左值与右值的意义 1.左值引用和右值引用最终目的是减少拷贝,提高效率 2.左值引用还可以修改参数/返回值 左值引用不足: 部分函数放回场景,只能传值返回,不能引用左值返回 当前函数局部对象,出了当前函数作用域生…

小程序学习06——uniapp组件常规引入和easycom引入语法

目录 一 组件注册 1.1 组件全局注册 1.2 组件全局引入 1.3 组件局部引入 页面引入组件方式 1.3.1 传统vue规范: 1.3.2 通过uni-app的easycom 二 组件的类型 2.1 基础组件列表 一 组件注册 1.1 组件全局注册 (a)新建compoents文件…

【时时三省】(C语言基础)常见的动态内存错误2

山不在高,有仙则名。水不在深,有龙则灵。 ----CSDN 时时三省 对非动态开辟空间内存使用free释放 示例: 这个arr数组是在栈上的 *p指向的就是arr 对非动态空间也用了free ferr只能在动态开辟空间使用 使用free释放一块动态开辟空间的一部分…

3D高斯点云CUDA版本数据制作与demo运行

0. 简介 关于UCloud(优刻得)旗下的compshare算力共享平台 UCloud(优刻得)是中国知名的中立云计算服务商,科创板上市,中国云计算第一股。 Compshare GPU算力平台隶属于UCloud,专注于提供高性价4090算力资源,配备独立IP,…

【游戏设计原理】46 - 魔杖

幻想,人们可以通过多种形式来引发,比如文字,图片,绘画,语言等,但游戏与以上这些形式的区别,正如游戏与其他艺术形式的区别一样,游戏作为一种艺术和娱乐形式,其独特之处在…

基于Java的敬老院管理系统的设计和实现【源码+文档+部署讲解】

基于Java的敬老院管理系统设计和实现 摘 要 新世纪以来,互联网与计算机技术的快速发展,我国也迈进网络化、集成化的信息大数据时代。对于大众而言,单机应用早已成为过去,传统模式早已满足不了当下办公生活等多种领域的需求,在一台电脑上不联网的软件少之又少&#x…

Git快速入门(一)·Git软件的安装以及GitHubDesktop客户端的安装

目录 1. 概述 1.1 版本控制介绍 1.1.1 集中式版本控制 1.1.2 分布式版本控制 1.1.3 多人协作开发 2. 安装Git 3. 安装GitHubDesktop客户端 1. 概述 Git 是一个免费的、开源的分布式版本控制系统。它能够快速高效地处理从小型到大型的各种项目。Git 具有易于学习…

数据挖掘——神经网络分类

神经网络分类 神经网络分类人工神经网络多层人工神经网络 误差反向传播(BP)网络后向传播算法 神经网络分类 人工神经网络 人工神经网络主要由大量的神经元以及它们之间的有向连接构成。包含三个方面: 神经元的激活规则 主要是指神经元输入…

PDF文件提示-文档无法打印-的解决办法

背景信息 下载了几个签名的PDF文件,想要打印纸质版,结果打印时 Adobe Acrobat Reader 提示【文档无法打印】: 解决办法 网上的方案是使用老版本的PDF阅读器, 因为无法打印只是一个标识而已。 PDF文件不能打印的五种解决方案-zhihu 这些方…

docker容器间基于bridge双向通信

前面介绍了通过link实现容器间的单向通信: docker容器间基于Link单向通信-CSDN博客 情景概述 通过前面已经知道了设置link来达到容器间通过容器名称双向通信,那是不是可以通过每个容器都设置link来达到双向通信,这种方式实现起来太麻烦&…

前端如何判断多个请求完毕

在前端开发中,经常会遇到需要同时发起多个异步请求,并在所有请求都完成后再进行下一步操作的情况。 这里有几个常用的方法来实现这一需求: 使用 Promise.all() Promise.all() 方法接收一个 Promise 对象的数组作为参数,当所有的…

云备份项目--服务端编写

文章目录 7. 数据管理模块7.1 如何设计7.2 完整的类 8. 热点管理8.1 如何设计8.2 完整的类 9. 业务处理模块9.1 如何设计9.2 完整的类9.3 测试9.3.1 测试展示功能 完整的代码–gitee链接 7. 数据管理模块 TODO: 读写锁?普通锁? 7.1 如何设计 需要管理…

exam0-试卷整理

exam0-试卷整理 2010,2013是梦开始的地方,大概率会出原题的 2010 2013 2015 大题 manchester RIP更新 说出ISO与TCP/IP模型的相同点和不同点(8分) 相似: 两者都有层次,网络专业人员都需要知道二者&a…

ACL---访问控制列表---策略

在路由器流量流入或者流出的接口上匹配流量,之后执行设定好的动作---permit(允许)deny(拒绝) 1.访问控制: 在路由器流量流入或者流出的接口上匹配流量,之后执行设定好的动作---permit&#xf…

element输入框及表单元素自定义前缀

如图所示&#xff1a; <el-input class"custom-input" placeholder"请输入" prefix-icon"prefix" v-model"form.name" clearable></el-input> :deep(.custom-input) {.el-input__icon {display: inline-block;width: 40…

C#调用Lua

目录 xLua导入 打包工具导入 单例基类导入与AB包管理器导入 Lua解析器 文件加载与重定向 Lua解析器管理器 全局变量获取 全局函数获取 对于无参数无返回值 对于有参数有返回值 对于多返回值 对于变长参数 完整代码 List与Dictionary映射Table 类映射Table 接口映射…