【HarmonyOS之旅】基于ArkTS开发(三) -＞ 兼容JS的类Web开发(三)

目录

1 -> 生命周期

1.1 -> 应用生命周期

1.2 -> 页面生命周期

2 -> 资源限定与访问

2.1 -> 资源限定词

2.2 -> 资源限定词的命名要求

2.3 -> 限定词与设备状态的匹配规则

2.4 -> 引用JS模块内resources资源

3 -> 多语言支持

3.1 -> 定义资源文件

3.2 -> 引用资源

1 -> 生命周期

1.1 -> 应用生命周期

在app.js中可以定义如下应用生命周期函数：

属性类型描述触发时机
onCreate() => void应用创建当应用创建时调用。
onShow6+() => void应用处于前台当应用处于前台时触发。
onHide6+() => void应用处于后台当应用处于后台时触发。
onDestroy() => void应用销毁当应用退出时触发。

1.2 -> 页面生命周期

在页面JS文件中可以定义如下页面生命周期函数：

属性类型描述触发时机
onInit() => void页面初始化页面数据初始化完成时触发，只触发一次。
onReady() => void页面创建完成页面创建完成时触发，只触发一次。
onShow() => void页面显示页面显示时触发。
onHide() => void页面消失页面消失时触发。
onDestroy() => void页面销毁页面销毁时触发。
onBackPress() => boolean返回按钮动作

当用户点击返回按钮时触发。

- 返回true表示页面自己处理返回逻辑。

- 返回false表示使用默认的返回逻辑。

- 不返回值会作为false处理。

onActive()5+() => void页面激活页面激活时触发。
onInactive()5+() => void页面暂停页面暂停时触发。
onNewRequest()5+() => voidFA重新请求FA已经启动时收到新的请求后触发。

页面A的生命周期接口的调用顺序

  • 打开页面A：onInit() -> onReady() -> onShow()

  • 在页面A打开页面B：onHide()

  • 从页面B返回页面A：onShow()

  • 退出页面A：onBackPress() -> onHide() -> onDestroy()

  • 页面隐藏到后台运行：onInactive() -> onHide()

  • 页面从后台运行恢复到前台：onShow() -> onActive()

2 -> 资源限定与访问

2.1 -> 资源限定词

资源限定词可以由一个或多个表征应用场景或设备特征的限定词组合而成，包括屏幕密度等维度，限定词之间通过中划线（-）连接。在resources目录下创建限定词文件时，需要掌握限定词文件的命名要求以及与限定词文件与设备状态的匹配规则。

2.2 -> 资源限定词的命名要求

  • 限定词的组合顺序：屏幕密度。开发者可以根据应用的使用场景和设备特征，选择其中的一类或几类限定词组成目录名称，顺序不可颠倒。

  • 限定词的连接方式：限定词之间均采用中划线（-）连接。例如：res-dark-ldpi.json 。

  • 限定词的取值范围：每类限定词的取值必须符合下表的条件，否则，将无法匹配目录中的资源文件，限定词大小写敏感。

  • 限定词前缀：resources资源文件的资源限定词有前缀res，例如res-ldpi.json。

  • 默认资源限定文件：resources资源文件的默认资源限定文件为res-defaults.json。

  • 资源限定文件中不支持使用枚举格式的颜色来设置资源。

表1 资源限定词
类型含义与取值说明
屏幕密度

表示设备的屏幕密度（单位为dpi），取值如下：

- sdpi：表示低密度屏幕（~120dpi）（0.75基准密度）

- mdpi：表示中密度屏幕（~160dpi）（基准密度）

- ldpi：表示高密度屏幕（~240dpi）（1.5基准密度）

- xhdpi：表示加高密度屏幕（~320dpi）（2.0基准密度）

- xxhdpi：表示超超高密度屏幕（~480dpi）（3.0基准密度）

- xxxhdpi：表示超超超高密度屏幕（~640dpi）（4.0基准密度）

2.3 -> 限定词与设备状态的匹配规则

  • 在为设备匹配对应的资源文件时，限定词目录匹配的优先级从高到低依次为：MCC和MNC> 横竖屏 > 深色模式 > 设备类型 > 屏幕密度。在资源限定词目录均未匹配的情况下，则匹配默认资源限定文件。

  • 如果限定词目录中包含资源限定词，则对应限定词的取值必须与当前的设备状态完全一致，该目录才能够参与设备的资源匹配。例如：资源限定文件res-hdpi.json与当前设备密度xhdpi无法匹配。

2.4 -> 引用JS模块内resources资源

在应用开发的hml和js文件中使用$r的语法，可以对JS模块内的resources目录下的json资源进行格式化，获取相应的资源内容，该目录与pages目录同级。

属性类型描述
$r(key: string) => string

获取资源限定下具体的资源内容。例如：$r('strings.hello')。

参数说明：

- key：定义在资源限定文件中的键值，如strings.hello。

res-defaults.json示例：

{"strings": {        "hello": "hello world"    }
}

3 -> 多语言支持

基于开发框架的应用会覆盖多个国家和地区，开发框架支持多语言能力后，可以让应用开发者无需开发多个不同语言的版本，就可以同时支持多种语言的切换，为项目维护带来便利。

3.1 -> 定义资源文件

资源文件用于存放应用在多种语言场景下的资源内容，开发框架使用JSON文件保存资源定义。在文件组织中指定的i18n文件夹内放置语言资源文件，其中语言资源文件的命名是由语言、文字、国家或地区的限定词通过中划线连接组成，其中文字和国家或地区可以省略，如zh-Hant-HK(中国香港地区使用的繁体中文)、zh-CN(中国使用的简体中文)、zh(中文)。命名规则如下：

language[-script-region].json

限定词的取值需符合下表要求。

表1 限定词取值要求
限定词类型含义与取值说明
语言表示设备使用的语言类型，由2~3个小写字母组成。例如：zh表示中文，en表示英语，mai表示迈蒂利语。
文字表示设备使用的文字类型，由1个大写字母(首字母)和3个小写字母组成。例如：Hans表示简体中文，Hant表示繁体中文。
国家或地区表示用户所在的国家或地区，由2~3个大写字母或者3个数字组成。例如：CN表示中国，GB表示英国。

当开发框架无法在应用中找到系统语言的资源文件时，默认使用en-US.json中的资源内容。

资源文件内容格式如下：

en-US.json

{"strings": {"hello": "Hello world!","object": "Object parameter substitution-{name}","array": "Array type parameter substitution-{0}","symbol": "@#$%^&*()_+-={}[]\\|:;\"'<>,./?"},"files": {"image": "image/en_picture.PNG"}
}

由于不同语言针对单复数有不同的匹配规则，在资源文件中使用“zero”“one”“two”“few”“many”“other”定义不同单复数场景下的词条内容。例如中文不区分单复数，仅存在“other”场景；英文存在“one”、“other”场景；阿拉伯语存在上述6种场景。

以en-US.json和ar-AE.json为例，资源文件内容格式如下：

en-US.json

{"strings": {"people": {"one": "one person","other": "{count} people"}}
}

ar-AE.json

{"strings": {"people": {"zero": "لا أحد","one": "وحده","two": "اثنان","few": "ستة اشخاص","many": "خمسون شخص","other": "مائة شخص"}}
}

3.2 -> 引用资源

在应用开发的页面中使用多语言的语法，包含简单格式化和单复数格式化两种，都可以在hml或js中使用。

  • 简单格式化方法

    在应用中使用$t方法引用资源，$t既可以在hml中使用，也可以在js中使用。系统将根据当前语言环境和指定的资源路径(通过$t的path参数设置)，显示对应语言的资源文件中的内容。

表2 简单格式化
属性类型必填描述
$tFunction是根据系统语言完成简单的替换：this.$t('strings.hello')
表3 $t参数说明
参数类型必填描述
pathstring是资源路径
paramsArrayObject否

运行时用来替换占位符的实际内容，占位符分为两种：

- 具名占位符，例如{name}。实际内容必须用Object类型指定，例如：$t('strings.object', {name:'Hello world'})。

- 数字占位符，例如{0}。实际内容必须用Array类型指定，例如：$t('strings.array', [Hello world']

简单格式化示例代码

<!-- test.hml -->
<div><!-- 不使用占位符，text中显示“Hello world!” --><text>{{ $t('strings.hello') }}</text><!-- 具名占位符格式，运行时将占位符{name}替换为“Hello world” --><text>{{ $t('strings.object', { name: 'Hello world' }) }}</text><!-- 数字占位符格式，运行时将占位符{0}替换为“Hello world” --><text>{{ $t('strings.array', ['Hello world']) }}</text><!-- 先在js中获取资源内容，再在text中显示“Hello world” --><text>{{ hello }}</text><!-- 先在js中获取资源内容，并将占位符{name}替换为“Hello world”，再在text中显示“Object parameter substitution-Hello world” --><text>{{ replaceObject }}</text><!-- 先在js中获取资源内容，并将占位符{0}替换为“Hello world”，再在text中显示“Array type parameter substitution-Hello world” --><text>{{ replaceArray }}</text><!-- 获取图片路径 --><image src="{{ $t('files.image') }}" class="image"></image><!-- 先在js中获取图片路径，再在image中显示图片 --><image src="{{ replaceSrc }}" class="image"></image>
</div>
// test.js
// 下面为在js文件中的使用方法。
export default {data: {hello: '',replaceObject: '',replaceArray: '',replaceSrc: '',},onInit() {this.hello = this.$t('strings.hello');this.replaceObject = this.$t('strings.object', { name: 'Hello world' });this.replaceArray = this.$t('strings.array', ['Hello world']);this.replaceSrc = this.$t('files.image');},   
}
  • 单复数格式化方法
表4 单复数格式化
属性类型必填描述
$tcFunction是

根据系统语言完成单复数替换：this.$tc('strings.people')

说明：

> 定义资源的内容通过json格式的key为“zero”、“one”、“two”、“few”、“many”和“other”区分。

表5 $tc参数说明
参数类型必填描述
pathstring是资源路径
countnumber是要表达的值
  • 单复数格式化示例代码
<!--test.hml-->
<div><!-- 传递数值为0时： "0 people" 阿拉伯语中此处匹配key为zero的词条--><text>{{ $tc('strings.people', 0) }}</text><!-- 传递数值为1时： "one person" 阿拉伯语中此处匹配key为one的词条--><text>{{ $tc('strings.people', 1) }}</text><!-- 传递数值为2时： "2 people" 阿拉伯语中此处匹配key为two的词条--><text>{{ $tc('strings.people', 2) }}</text><!-- 传递数值为6时： "6 people" 阿拉伯语中此处匹配key为few的词条--><text>{{ $tc('strings.people', 6) }}</text><!-- 传递数值为50时： "50 people" 阿拉伯语中此处匹配key为many的词条--><text>{{ $tc('strings.people', 50) }}</text><!-- 传递数值为100时： "100 people" 阿拉伯语中此处匹配key为other的词条--><text>{{ $tc('strings.people', 100) }}</text>
</div>

感谢各位大佬支持！！！

互三啦！！！

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

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

相关文章

Linux网络 | 理解TCP面向字节流、打通socket与文件的关系

Linux网络 | 理解TCP面向字节流、打通socket与文件的关系

前言&#xff1a;我们经常说TCP是面向字节流的&#xff0c; TCP是面向字节流的。 但是&#xff0c; 到底是什么事面向字节流呢&#xff1f; 另外&#xff0c; 我们知道sockfd其实就是文件fd。 但是&#xff0c;为什么sockfd是文件fd呢&#xff1f; 这些问题都在本节内容中的到回…
阅读更多...
FireFox | Google Chrome | Microsoft Edge 禁用更新 final版

FireFox | Google Chrome | Microsoft Edge 禁用更新 final版

之前的方式要么失效&#xff0c;要么对设备有要求&#xff0c;这次梳理一下对设备、环境几乎没有要求的通用方式&#xff0c;universal & final 版。 1.Firefox 方式 FireFox火狐浏览器企业策略禁止更新_火狐浏览器禁止更新-CSDN博客 这应该是目前最好用的方式。火狐也…
阅读更多...
大数据学习之Kafka消息队列、Spark分布式计算框架一

大数据学习之Kafka消息队列、Spark分布式计算框架一

Kafka消息队列 章节一.kafka入门 4.kafka入门_消息队列两种模式 5.kafka入门_架构相关名词 Kafka 入门 _ 架构相关名词 事件 记录了世界或您的业务中 “ 发生了某事 ” 的事实。在文档中 也称为记录或消息。当您向 Kafka 读取或写入数据时&#xff0c;您以事件的 形式执行…
阅读更多...
深度学习指标可视化案例

深度学习指标可视化案例

TensorBoard 代码案例&#xff1a;from torch.utils.tensorboard import SummaryWriter import torch import torchvision from torchvision import datasets, transforms# 设置TensorBoard日志路径 writer SummaryWriter(runs/mnist)# 加载数据集 transform transforms.Comp…
阅读更多...
Linux文件原生操作

Linux文件原生操作

Linux 中一切皆文件&#xff0c;那么 Linux 文件是什么&#xff1f; 在 Linux 中的文件 可以是&#xff1a;传统意义上的有序数据集合&#xff0c;即&#xff1a;文件系统中的物理文件 也可以是&#xff1a;设备&#xff0c;管道&#xff0c;内存。。。(Linux 管理的一切对象…
阅读更多...
基于springboot+vue的流浪动物救助系统的设计与实现

基于springboot+vue的流浪动物救助系统的设计与实现

开发语言&#xff1a;Java框架&#xff1a;springbootJDK版本&#xff1a;JDK1.8服务器&#xff1a;tomcat7数据库&#xff1a;mysql 5.7&#xff08;一定要5.7版本&#xff09;数据库工具&#xff1a;Navicat11开发软件&#xff1a;eclipse/myeclipse/ideaMaven包&#xff1a;…
阅读更多...
提供一种刷新X410内部EMMC存储器的方法

提供一种刷新X410内部EMMC存储器的方法

USRP X410内部采用了16G的EMMC存储器&#xff0c;内有内核和文件系统。官方站[注1]提供了多个版本的EMMC映像文件&#xff0c;并提供了多种刷新方法[注2]。 1&#xff0c;如果内核还能运行只是文件系统破坏&#xff0c;可以从外接USB盘&#xff0c;之后使用mount挂载U盘&#…
阅读更多...
CTFSHOW-WEB入门-命令执行29-32

CTFSHOW-WEB入门-命令执行29-32

题目&#xff1a;web 29 题目&#xff1a;解题思路&#xff1a;分析代码&#xff1a; error_reporting(0); if(isset($_GET[c])){//get一个c的参数$c $_GET[c];//赋值给Cif(!preg_match("/flag/i", $c)){eval($c);//if C变量里面没有flag&#xff0c;那么就执行C…
阅读更多...
探索AI（chatgpt、文心一言、kimi等）提示词的奥秘

探索AI（chatgpt、文心一言、kimi等）提示词的奥秘

大家好&#xff0c;我是老六哥&#xff0c;我正在共享使用AI提高工作效率的技巧。欢迎关注我&#xff0c;共同提高使用AI的技能&#xff0c;让AI成功你的个人助理。 "AI提示词究竟是什么&#xff1f;" 这是许多初学者在接触AI时的共同疑问。 "我阅读了大量关于…
阅读更多...
【CS61A 2024秋】Python入门课，全过程记录P4（Week7 Generators开始，更新于2025/1/29）

【CS61A 2024秋】Python入门课，全过程记录P4（Week7 Generators开始，更新于2025/1/29）

文章目录 关于基本介绍&#x1f44b;新的问题更好的解决方案Week7Mon Generators阅读材料Lab 05: Iterators, MutabilityQ1: WWPD: List-MutationQ2: Insert Items 关于 个人博客&#xff0c;里面偶尔更新&#xff0c;最近比较忙。发一些总结的帖子和思考。 江湖有缘相见&…
阅读更多...
使用 OpenResty 构建高效的动态图片水印代理服务20250127

使用 OpenResty 构建高效的动态图片水印代理服务20250127

使用 OpenResty 构建高效的动态图片水印代理服务 在当今数字化的时代&#xff0c;图片在各种业务场景中广泛应用。为了保护版权、统一品牌形象&#xff0c;动态图片水印功能显得尤为重要。然而&#xff0c;直接在后端服务中集成水印功能&#xff0c;往往会带来代码复杂度增加、…
阅读更多...
【MySQL — 数据库增删改查操作】深入解析MySQL的 Update 和 Delete 操作

【MySQL — 数据库增删改查操作】深入解析MySQL的 Update 和 Delete 操作

1. 测试数据 mysql> select* from exam1; ----------------------------------------- | id | name | Chinese | Math | English | ----------------------------------------- | 1 | 唐三藏 | 67.0 | 98.0 | 56.0 | | 2 | 孙悟空 | 87.0 | 78.…
阅读更多...
webAPI -DOM 相关知识点总结（非常细）

webAPI -DOM 相关知识点总结（非常细）

title: WebAPI语法 date: 2025-01-28 12:00:00 tags:- 前端 categories:- 前端WEB API 了解DOM的结构并掌握其基本的操作&#xff0c;体验 DOM 在开发中的作用 API简介 就是使用js来操作html和浏览器 什么是DOM? 就是一个文档对象模型&#xff0c;是用来呈现预计于任意htm…
阅读更多...
图论——最小生成树的扩展应用

图论——最小生成树的扩展应用

最小生成树相关原理 acwing1146.新的开始 假设存在一个“超级发电站” 在每一个矿井修发电站相当于从这个“超级发电站”到各个矿井连一条长度为 v [ i ] v[i] v[i]的边。 这样一来这就是一个最短路的模板题。 #include <iostream> #include <cstring> using na…
阅读更多...
K8S中高级存储之PV和PVC

K8S中高级存储之PV和PVC

高级存储 PV和PVC 由于kubernetes支持的存储系统有很多&#xff0c;要求客户全都掌握&#xff0c;显然不现实。为了能够屏蔽底层存储实现的细节&#xff0c;方便用户使用&#xff0c; kubernetes引入PV和PVC两种资源对象。 PV&#xff08;Persistent Volume&#xff09; PV是…
阅读更多...
宝塔面板SSL加密访问设置教程

宝塔面板SSL加密访问设置教程

参考:https://www.bt.cn/bbs/thread-117246-1-1.html 如何快速使用证书加密访问面板 因早期默认未开启https访问所以没有相关的风险提醒&#xff0c;现面板默认已开启https加密访问、提升安全性 由于采用的是服务器内部本身签发证书&#xff0c;不被公网浏览器信任请参考以下步…
阅读更多...
深入探讨数据库索引类型：B-tree、Hash、GIN与GiST的对比与应用

深入探讨数据库索引类型：B-tree、Hash、GIN与GiST的对比与应用

title: 深入探讨数据库索引类型：B-tree、Hash、GIN与GiST的对比与应用 date: 2025/1/26 updated: 2025/1/26 author: cmdragon excerpt: 在现代数据库管理系统中，索引技术是提高查询性能的重要手段。当数据量不断增长时，如何快速、有效地访问这些数据成为了数据库设计的核…
阅读更多...
21.2-工程中添加FreeRTOS(掌握) 用STM32CubeMX添加FreeRTOS

21.2-工程中添加FreeRTOS(掌握) 用STM32CubeMX添加FreeRTOS

这个是全网最详细的STM32项目教学视频。 第一篇在这里: 视频在这里 STM32智能小车V3-STM32入门教程-openmv与STM32循迹小车-stm32f103c8t6-电赛 嵌入式学习 PID控制算法 编码器电机 跟随 **V3:HAL库开发、手把手教学下面功能&#xff1a;PID速度控制、PID循迹、PID跟随、遥控、…
阅读更多...
【越学学糊涂的Linux系统】Linux指令篇（二）

【越学学糊涂的Linux系统】Linux指令篇（二）

一、pwd指令&#xff1a; 00x0:打印该用户当前目录下所属的文件路径 看指令框可以看出我用的是一个叫sw的用户&#xff0c;我们的路径就是在一个home目录下的sw目录下的class113文件路径。 也可以说是指出当前所处的工作目录 补充&#xff1a;&#x1f386;​​​​​​​Wi…
阅读更多...
LangGraph系列-1：用LangGraph构建简单聊天机器人

LangGraph系列-1：用LangGraph构建简单聊天机器人

在快速发展的人工智能和大型语言模型&#xff08;llm&#xff09;世界中&#xff0c;开发人员不断寻求创建更灵活、更强大、更直观的人工智能代理的方法。 虽然LangChain已经改变了这个领域的游戏规则&#xff0c;允许创建复杂的链和代理&#xff0c;但对代理运行时的更复杂控制…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023