From 24eec79bbd43cfe66434781d1ad23ff8198fad00 Mon Sep 17 00:00:00 2001 From: jsq99 Date: Mon, 30 Dec 2024 16:11:28 +0800 Subject: [PATCH] =?UTF-8?q?docs:=20[#IBENKD]=20=E4=BF=AE=E6=94=B9ahoos?= =?UTF-8?q?=E3=80=81axios=E3=80=81crypto-js=E7=AD=89=E6=96=87=E6=A1=A3?= =?UTF-8?q?=E7=9A=84=E8=8B=B1=E6=96=87=E7=BF=BB=E8=AF=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- en/js/axios.md | 70 ++-- en/js/crypto-js.md | 440 ++++++++++---------- en/js/jsbarcode.md | 56 +-- en/js/moment.md | 260 ++++++------ en/js/prop-types.md | 48 +-- en/js/react-ahooks.md | 212 +++++----- en/js/redux-toolkit.md | 125 +++--- en/js/styled-system.md | 133 +++--- en/react-native-animate-number.md | 30 +- en/react-native-echarts-pro.md | 38 +- en/react-native-fit-Image.md | 162 +++---- en/react-native-ohos-community-auto-fill.md | 176 ++++---- en/react-native-pull.md | 44 +- en/react-native-scrollable-tab-view.md | 42 +- en/react-native-stickyheader.md | 30 +- en/react-native-swiper.md | 32 +- en/react-native-video.md | 202 ++++----- 17 files changed, 1051 insertions(+), 1049 deletions(-) diff --git a/en/js/axios.md b/en/js/axios.md index 4f1893e9..acecdfae 100644 --- a/en/js/axios.md +++ b/en/js/axios.md @@ -9,7 +9,7 @@

-> [!TIP] [Github 地址](https://github.com/axios/axios) +> [!TIP] [Github address](https://github.com/axios/axios) ## Installation and Usage @@ -112,42 +112,42 @@ This document is verified based on the following versions: > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :--------------------------------- | -------------------------- | :------: | :------: | :---------------: | -| axios.request(config) | 别名发送request请求 | function | / | yes | -| axios.get(url[, config]) | 别名发送get请求 | function | / | yes | -| axios.delete(url[, config]) | 别名发送delete请求 | function | / | yes | -| axios.head(url[, config]) | 别名发送head请求 | function | / | yes | -| axios.options(url[, config]) | 别名发送options请求 | function | / | yes | -| axios.post(url[, data[, config]]) | 别名发送post请求 | function | / | yes | -| axios.put(url[, data[, config]]) | 别名发送put请求 | function | / | yes | -| axios.patch(url[, data[, config]]) | 别名发送patch请求 | function | / | yes | -| axios#request(config) | 实例发送request请求 | function | / | yes | -| axios#get(url[, config]) | 实例发送get请求 | function | / | yes | -| axios#delete(url[, config]) | 实例发送delete请求 | function | / | yes | -| axios#head(url[, config]) | 实例发送head请求 | function | / | yes | -| axios#options(url[, config]) | 实例发送options请求 | function | / | yes | -| axios#post(url[, data[, config]]) | 实例发送post请求 | function | / | yes | -| axios#put(url[, data[, config]]) | 实例发送put请求 | function | / | yes | -| axios#patch(url[, data[, config]]) | 实例发送patch请求 | function | / | yes | -| url | 配置中请求的地址 | function | / | yes | -| method | 配置中请求时使用的方法 | function | / | yes | -| baseURL | 配置中自动加在url地址前 | function | / | yes | -| headers | 配置中自定义请求头 | function | / | yes | -| params | 配置中请求一起发送时的参数 | function | / | yes | -| data | 配置中请求体发送的数据 | function | / | yes | -| timeout | 配置中请求超时的毫秒数 | function | / | yes | -| proxy | 配置中设置代理 | function | / | yes | -| Response Schema | 响应类型 | function | / | yes | -| Config Defaults | 默认配置 | function | / | yes | -| requestInterceptors | 请求拦截器 | function | / | yes | -| responseInterceptors | 响应拦截器 | function | / | yes | -| Handling Errors | 错误处理 | function | / | yes | -| AbortController | 中止控制器 | function | / | yes | -| CancelToken | 取消令牌 | function | / | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :--------------------------------- | ---------------------------------------------------- | :------: | :------: | :---------------: | +| axios.request(config) | Alias method for sending a **request**. | function | / | yes | +| axios.get(url[, config]) | Alias method for sending a **get** request. | function | / | yes | +| axios.delete(url[, config]) | Alias method for sending a **delete** request. | function | / | yes | +| axios.head(url[, config]) | Alias method for sending a **head** request. | function | / | yes | +| axios.options(url[, config]) | Alias method for sending an **options** request. | function | / | yes | +| axios.post(url[, data[, config]]) | Alias method for sending a **post** request. | function | / | yes | +| axios.put(url[, data[, config]]) | Alias method for sending a **put** request. | function | / | yes | +| axios.patch(url[, data[, config]]) | Alias method for sending a **patch** request. | function | / | yes | +| axios#request(config) | Instance method for sending a **request**. | function | / | yes | +| axios#get(url[, config]) | Instance method for sending a **get** request. | function | / | yes | +| axios#delete(url[, config]) | Instance method for sending a **delete** request. | function | / | yes | +| axios#head(url[, config]) | Instance method for sending a **head** request. | function | / | yes | +| axios#options(url[, config]) | Instance method for sending an **options** request. | function | / | yes | +| axios#post(url[, data[, config]]) | Instance method for sending a **post** request. | function | / | yes | +| axios#put(url[, data[, config]]) | Instance method for sending a **put** request. | function | / | yes | +| axios#patch(url[, data[, config]]) | Instance method for sending a **patch** request. | function | / | yes | +| url | URL requested. | function | / | yes | +| method | Method used to request. | function | / | yes | +| baseURL | Base URL added automatically before the URL. | function | / | yes | +| headers | Custom header requested. | function | / | yes | +| params | Parameters to be sent with the request. | function | / | yes | +| data | Data sent by the request body. | function | / | yes | +| timeout | Number of milliseconds in which a request times out. | function | / | yes | +| proxy | Proxy set in the configuration. | function | / | yes | +| Response Schema | Response type. | function | / | yes | +| Config Defaults | Default configuration. | function | / | yes | +| requestInterceptors | Request interceptor. | function | / | yes | +| responseInterceptors | Response interceptor. | function | / | yes | +| Handling Errors | Error handling. | function | / | yes | +| AbortController | Abort controller. | function | / | yes | +| CancelToken | Cancel token. | function | / | yes | ## Others ## License -This project is licensed under [The MIT License (MIT)](https://github.com/Kureev/react-native-blur/blob/master/LICENSE), Please enjoy and participate freely in open source. +This project is licensed under [MIT License](https://github.com/Kureev/react-native-blur/blob/master/LICENSE). \ No newline at end of file diff --git a/en/js/crypto-js.md b/en/js/crypto-js.md index 95e1b776..9e8564f2 100644 --- a/en/js/crypto-js.md +++ b/en/js/crypto-js.md @@ -120,7 +120,7 @@ This document is verified based on the following versions: ## API List -**以下 `C` 均为crypto-js导出的对象，即：** +**The following `C` is an object exported by crypto-js:** ```typescript import C from "crypto-js"; @@ -132,19 +132,19 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ----------------- | -------------------------------- | -------- | -------- | ----------------- | -| C.lib.Base.extend | 创建一个新对象并继承自指定对象。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ----------------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| C.lib.Base.extend | Creates an object and inherits it from the specified object. | function | no | yes | **API** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ------ | ------------------------------ | -------- | -------- | ----------------- | -| create | 创建对象的实例。 | function | no | yes | -| mixIn | 向对象中添加属性键值对。 | function | no | yes | -| clone | 创建一个对象的克隆版本的新对象 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ------ | ------------------------------------- | -------- | -------- | ----------------- | +| create | Creates an object instance. | function | no | yes | +| mixIn | Adds a property KV pair to an object. | function | no | yes | +| clone | Creates a clone version of an object. | function | no | yes | #### WordArray @@ -152,30 +152,30 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| -------- | ------------------------ | -------- | -------- | ----------------- | -| words | 32位的字节数组。 | number[] | no | yes | -| sigBytes | 此字数组中的有效字节数。 | number | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| -------- | ------------------------------------ | -------- | -------- | ----------------- | +| words | A 32-bit byte array. | number[] | no | yes | +| sigBytes | Number of valid bytes in this array. | number | no | yes | **Static Methods** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ---------------------- | ---------------------------------- | -------- | -------- | ------------------------------- | -| C.lib.WordArray.create | 初始化新创建的字节数组。 | function | no | yes | -| C.lib.WordArray.random | 创建一个用随机字节填充的字节数组。 | function | no | no (与android和ios一致均不支持) | +| Name | Description | Type | Required | HarmonyOS Support | +| ---------------------- | ---------------------------------------------- | -------- | -------- | ---------------------------- | +| C.lib.WordArray.create | Initializes a newly created byte array. | function | no | yes | +| C.lib.WordArray.random | Creates a byte array filled with random bytes. | function | no | no (same as Android and iOS) | **API** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| -------- | ---------------------------------- | -------- | -------- | ----------------- | -| toString | 字节数组转换为字符串。 | function | no | yes | -| concat | 将一个字节数组连接到这个字节数组。 | function | no | yes | -| clamp | 移除无效字节。 | function | no | yes | -| clone | 复制数组，并创建新数组。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| -------- | --------------------------------------------- | -------- | -------- | ----------------- | +| toString | Converts a byte array into a string. | function | no | yes | +| concat | Concatenates a byte array to this byte array. | function | no | yes | +| clamp | Removes invalid bytes. | function | no | yes | +| clone | Clones and creates an array. | function | no | yes | #### CipherParams @@ -183,33 +183,33 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ---------- | --------------------------------------------------- | ------------ | -------- | ----------------- | -| ciphertext | 原始密文。 | WordArray | no | yes | -| key | 密文的Key。 | WordArray | no | yes | -| iv | 在加密操作中使用的IV。 | WordArray | no | yes | -| salt | 与密钥推导函数一起使用的salt。 | WordArray | no | yes | -| algorithm | 密码算法。 | CipherStatic | no | yes | -| mode | 加密操作中使用的块模式。 | Mode | no | yes | -| padding | 加密操作中使用的填充方案。 | Padding | no | yes | -| blockSize | 密码的块大小。 | number | no | yes | -| formatter | 将此cipher params对象转换为字符串的默认格式化策略。 | Format | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ---------- | ------------------------------------------------------------ | ------------ | -------- | ----------------- | +| ciphertext | Original ciphertext. | WordArray | no | yes | +| key | Key of the ciphertext. | WordArray | no | yes | +| iv | Initialization Vector (IV) used in the encryption. | WordArray | no | yes | +| salt | Salt used with the key derivation function. | WordArray | no | yes | +| algorithm | Password algorithm. | CipherStatic | no | yes | +| mode | Block mode used in the encryption. | Mode | no | yes | +| padding | Padding used in the encryption. | Padding | no | yes | +| blockSize | Block size of the password. | number | no | yes | +| formatter | Default formatting policy for converting the **cipher params** object to a string. | Format | no | yes | **Static Methods** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ------------------------- | --------------------------------- | -------- | -------- | ----------------- | -| C.lib.CipherParams.create | 初始化新创建的cipher params对象。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ------------------------- | ------------------------------------------------------- | -------- | -------- | ----------------- | +| C.lib.CipherParams.create | Initializes the newly created **cipher params** object. | function | no | yes | **API** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| -------- | ----------------------------------- | -------- | -------- | ----------------- | -| toString | 将此cipher params对象转换为字符串。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| -------- | -------------------------------------------------- | -------- | -------- | ----------------- | +| toString | Converts the **cipher params** object to a string. | function | no | yes | #### X64 @@ -217,9 +217,9 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ----------------- | ---------------------- | -------- | -------- | ----------------- | -| C.x64.Word.create | 初始化新创建的64位字。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ----------------- | ---------------------------------------- | -------- | -------- | ----------------- | +| C.x64.Word.create | Initializes a newly created 64-bit word. | function | no | yes | #### X64WordArray @@ -227,27 +227,27 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| -------- | ----------------------------- | -------- | -------- | ----------------- | -| words | CryptoJS.x64.Word对象的数组。 | number[] | no | yes | -| sigBytes | 此字数组中的有效字节数。 | number | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| -------- | ------------------------------------------ | -------- | -------- | ----------------- | +| words | Array of the **CryptoJS.x64.Word** object. | number[] | no | yes | +| sigBytes | Number of valid bytes in this array. | number | no | yes | **Static Methods** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ---------------------- | ------------------------ | -------- | -------- | ----------------- | -| C.x64.WordArray.create | 初始化新创建的单词数组。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ---------------------- | --------------------------------------- | -------- | -------- | ----------------- | +| C.x64.WordArray.create | Initializes a newly created word array. | function | no | yes | **API** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ----- | -------------------------------- | -------- | -------- | ----------------- | -| toX32 | 将此64位字数组转换为32位字数组。 | function | no | yes | -| clone | 创建此字节数组的副本。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ----- | ---------------------------------------------------- | -------- | -------- | ----------------- | +| toX32 | Converts a 64-bit word array to a 32-bit word array. | function | no | yes | +| clone | Creates a copy of this byte array. | function | no | yes | #### mode @@ -255,13 +255,13 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ---------- | ---------------- | ---- | -------- | ----------------- | -| C.mode.CBC | 密码块链模式。 | / | no | yes | -| C.mode.CFB | 密码反馈块模式。 | / | no | yes | -| C.mode.CTR | 计数器阻塞模式。 | / | no | yes | -| C.mode.OFB | 输出反馈块模式。 | / | no | yes | -| C.mode.ECB | 电子码本块模式。 | / | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ---------- | ---------------------- | ---- | -------- | ----------------- | +| C.mode.CBC | Cipher block chaining. | / | no | yes | +| C.mode.CFB | Cipher feedback block. | / | no | yes | +| C.mode.CTR | Counter mode. | / | no | yes | +| C.mode.OFB | Output feedback block. | / | no | yes | +| C.mode.ECB | Electronic code book. | / | no | yes | #### pad.Pkcs7 @@ -269,10 +269,10 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ----------------- | --------------------------------------------- | -------- | -------- | ----------------- | -| C.pad.Pkcs7.pad | 使用PKCS #5/7中定义的算法填充数据。 | function | no | yes | -| C.pad.Pkcs7.unpad | 取消填充使用PKCS #5/7中定义的算法填充的数据。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ----------------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| C.pad.Pkcs7.pad | Pads the data using the algorithm defined in PKCS #5 or PKCS #7. | function | no | yes | +| C.pad.Pkcs7.unpad | Unpads the data using the algorithm defined in PKCS #5 or PKCS #7. | function | no | yes | #### pad.AnsiX923 @@ -280,10 +280,10 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| -------------------- | -------------------------------------------- | -------- | -------- | ----------------- | -| C.pad.AnsiX923.pad | 使用AnsiX923中定义的算法填充数据。 | function | no | yes | -| C.pad.AnsiX923.unpad | 取消填充使用AnsiX923中定义的算法填充的数据。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| -------------------- | -------------------------------------------------------- | -------- | -------- | ----------------- | +| C.pad.AnsiX923.pad | Pads the data using the algorithm defined in AnsiX923. | function | no | yes | +| C.pad.AnsiX923.unpad | Unpads the data using the algorithm defined in AnsiX923. | function | no | yes | #### pad.Iso10126 @@ -291,10 +291,10 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| -------------------- | -------------------------------------------- | -------- | -------- | ------------------------------- | -| C.pad.Iso10126.pad | 使用Iso10126中定义的算法填充数据。 | function | no | no (与android和ios一致均不支持) | -| C.pad.Iso10126.unpad | 取消填充使用Iso10126中定义的算法填充的数据。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| -------------------- | -------------------------------------------------------- | -------- | -------- | ---------------------------- | +| C.pad.Iso10126.pad | Pads the data using the algorithm defined in ISO10126. | function | no | no (same as Android and iOS) | +| C.pad.Iso10126.unpad | Unpads the data using the algorithm defined in ISO10126. | function | no | yes | #### pad.ZeroPadding @@ -302,10 +302,10 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ----------------------- | ----------------------------------------------- | -------- | -------- | ----------------- | -| C.pad.ZeroPadding.pad | 使用ZeroPadding中定义的算法填充数据。 | function | no | yes | -| C.pad.ZeroPadding.unpad | 取消填充使用ZeroPadding中定义的算法填充的数据。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ----------------------- | ----------------------------------------------------------- | -------- | -------- | ----------------- | +| C.pad.ZeroPadding.pad | Pads the data using the algorithm defined in ZeroPadding. | function | no | yes | +| C.pad.ZeroPadding.unpad | Unpads the data using the algorithm defined in ZeroPadding. | function | no | yes | #### pad.NoPadding @@ -313,9 +313,9 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| --------------- | ---------------- | ---- | -------- | ----------------- | -| C.pad.NoPadding | 不使用填充规则。 | / | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| --------------- | ------------------------- | ---- | -------- | ----------------- | +| C.pad.NoPadding | No padding rules is used. | / | no | yes | #### algo @@ -323,24 +323,24 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| ----------------------- | ----------------------------------- | -------- | -------- | ----------------- | -| C.algo.MD5.create | 初始化MD5加密新创建的工具类。 | function | no | yes | -| C.MD5 | MD5加密。 | function | no | yes | -| C.algo.SHA1.create | 初始化SHA1加密新创建的工具类。 | function | no | yes | -| C.SHA1 | SHA1加密。 | function | no | yes | -| C.algo.SHA256.create | 初始化SHA256加密新创建的工具类。 | function | no | yes | -| C.SHA256 | SHA256加密 | function | no | yes | -| C.algo.SHA224.create | 初始化SHA224加密新创建的工具类。 | function | no | yes | -| C.SHA224 | SHA224加密。 | function | no | yes | -| C.algo.SHA512.create | 初始化SHA512加密新创建的工具类。 | function | no | yes | -| C.SHA512 | SHA512加密。 | function | no | yes | -| C.algo.SHA3.create | 初始化SHA3加密新创建的工具类。 | function | no | yes | -| C.SHA3 | SHA3加密。 | function | no | yes | -| C.algo.SHA384.create | 初始化SHA384加密新创建的工具类。 | function | no | yes | -| C.SHA384 | SHA384加密。 | function | no | yes | -| C.algo.RIPEMD160.create | 初始化RIPEMD160加密新创建的工具类。 | function | no | yes | -| C.RIPEMD160 | RIPEMD160加密。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ----------------------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| C.algo.MD5.create | Initializes the utility class created by MD5 encryption. | function | no | yes | +| C.MD5 | Indicates the MD5 encryption. | function | no | yes | +| C.algo.SHA1.create | Initializes the utility class created by SHA1 encryption. | function | no | yes | +| C.SHA1 | Indicates the SHA1 encryption. | function | no | yes | +| C.algo.SHA256.create | Initializes the utility class created by SHA256 encryption. | function | no | yes | +| C.SHA256 | Indicates the SHA256 encryption. | function | no | yes | +| C.algo.SHA224.create | Initializes the utility class created by SHA224 encryption. | function | no | yes | +| C.SHA224 | Indicates the SHA224 encryption. | function | no | yes | +| C.algo.SHA512.create | Initializes the utility class created by SHA512 encryption. | function | no | yes | +| C.SHA512 | Indicates the SHA512 encryption. | function | no | yes | +| C.algo.SHA3.create | Initializes the utility class created by SHA3 encryption. | function | no | yes | +| C.SHA3 | Indicates the SHA3 encryption. | function | no | yes | +| C.algo.SHA384.create | Initializes the utility class created by SHA384 encryption. | function | no | yes | +| C.SHA384 | Indicates the SHA384 encryption. | function | no | yes | +| C.algo.RIPEMD160.create | Initializes the utility class created by RIPEMD160 encryption. | function | no | yes | +| C.RIPEMD160 | Indicates the RIPEMD160 encryption. | function | no | yes | #### Hasher @@ -348,19 +348,19 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| --------- | ------------------------------------------------------ | ------ | -------- | ----------------- | -| blockSize | 哈希运算的32位字节块大小。缺省值：16(32\*16=512bits)。 | number | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| --------- | ------------------------------------------------------------ | ------ | -------- | ----------------- | +| blockSize | Size of the 32-bit block for hashing. Default value: **16(32\*16=512 bits)**. | number | no | yes | **API** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| -------- | ---------------------- | -------- | -------- | ----------------- | -| reset | 重置hasher为初始状态。 | function | no | yes | -| update | 更新hasher的信息。 | function | no | yes | -| finalize | 结束hasher操作。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| -------- | ----------------------------------- | -------- | -------- | ----------------- | +| reset | Resets Hasher to the initial state. | function | no | yes | +| update | Updates the Hasher information. | function | no | yes | +| finalize | Ends the Hasher operation. | function | no | yes | #### HMAC @@ -368,27 +368,27 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :----------------- | -------------------- | -------- | -------- | ----------------- | -| C.HmacMD5 | HmacMD5加密。 | function | no | yes | -| C.HmacSHA1 | HmacSHA1加密。 | function | no | yes | -| C.HmacSHA256 | HmacSHA256加密。 | function | no | yes | -| C.HmacSHA224 | HmacSHA224加密。 | function | no | yes | -| C.HmacSHA512 | HmacSHA512加密。 | function | no | yes | -| C.HmacSHA384 | HmacSHA384加密。 | function | no | yes | -| C.HmacSHA3 | HmacSHA3加密。 | function | no | yes | -| C.HmacRIPEMD160 | HmacRIPEMD160加密。 | function | no | yes | -| C.algo.HMAC.create | 初始化新创建的HMAC。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :----------------- | --------------------------------------- | -------- | -------- | ----------------- | +| C.HmacMD5 | Indicates the HMAC-MD5 encryption. | function | no | yes | +| C.HmacSHA1 | Indicates the HMAC-SHA1 encryption. | function | no | yes | +| C.HmacSHA256 | Indicates the HMAC-SHA256 encryption. | function | no | yes | +| C.HmacSHA224 | Indicates the HMAC-SHA224 encryption. | function | no | yes | +| C.HmacSHA512 | Indicates the HMAC-SHA512 encryption. | function | no | yes | +| C.HmacSHA384 | Indicates the HMAC-SHA384 encryption. | function | no | yes | +| C.HmacSHA3 | Indicates the HMAC-SHA3 encryption. | function | no | yes | +| C.HmacRIPEMD160 | Indicates the HMACRIPEMD160 encryption. | function | no | yes | +| C.algo.HMAC.create | Initializes newly created HMAC. | function | no | yes | **API** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :------- | -------------------------------------------------------------------------- | -------- | -------- | ----------------- | -| reset | 将此HMAC重置为其初始状态。 | function | no | yes | -| update | 使用消息更新此HMAC。 | function | no | yes | -| finalize | 最终完成HMAC计算。 请注意，finally操作实际上是一个破坏性的、读一次的操作。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| reset | Resets this HMAC to its initial state. | function | no | yes | +| update | Updates this HMAC using a message. | function | no | yes | +| finalize | Finalizes the HMAC calculation. Note that this is a destructive and read-once operation. | function | no | yes | #### AES @@ -396,11 +396,11 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| :------------------------- | --------------------------- | -------- | -------- | ----------------- | ------------------------------------------------------------------------------ | -| C.AES.encrypt | AES算法加密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.AES.decrypt | AES算法解密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.algo.AES.createEncryptor | 在AES加密模式下创建此密码。 | function | no | yes | | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| :------------------------- | ------------------------------------------ | -------- | -------- | ----------------- | ------------------------------------------------------------ | +| C.AES.encrypt | Encrypts using the AES algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.AES.decrypt | Decrypts using the AES algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.algo.AES.createEncryptor | Creates a password in AES encryption mode. | function | no | yes | | #### DES @@ -408,11 +408,11 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| :------------------------- | --------------------------- | -------- | -------- | ----------------- | ------------------------------------------------------------------------------ | -| C.DES.encrypt | DES算法加密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.DES.decrypt | DES算法解密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.algo.DES.createEncryptor | 在DES加密模式下创建此密码。 | function | no | yes | | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| :------------------------- | ------------------------------------------ | -------- | -------- | ----------------- | ------------------------------------------------------------ | +| C.DES.encrypt | Encrypts using the DES algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.DES.decrypt | Decrypts using the DES algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.algo.DES.createEncryptor | Creates a password in DES encryption mode. | function | no | yes | | #### TripleDES @@ -420,11 +420,11 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| :------------------------------- | --------------------------------- | -------- | -------- | ----------------- | ------------------------------------------------------------------------------ | -| C.TripleDES.encrypt | TripleDES算法加密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.TripleDES.decrypt | TripleDES算法解密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.algo.TripleDES.createEncryptor | 在TripleDES加密模式下创建此密码。 | function | no | yes | | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| :------------------------------- | ------------------------------------------------ | -------- | -------- | ----------------- | ------------------------------------------------------------ | +| C.TripleDES.encrypt | Encrypts using the TripleDES algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.TripleDES.decrypt | Decrypts using the TripleDES algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.algo.TripleDES.createEncryptor | Creates a password in TripleDES encryption mode. | function | no | yes | | #### RC4 @@ -432,11 +432,11 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| :------------------------- | --------------------------- | -------- | -------- | ----------------- | ------------------------------------------------------------------------------ | -| C.RC4.encrypt | RC4算法加密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.RC4.decrypt | RC4算法解密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.algo.RC4.createEncryptor | 在RC4加密模式下创建此密码。 | function | no | yes | | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| :------------------------- | ------------------------------------------ | -------- | -------- | ----------------- | ------------------------------------------------------------ | +| C.RC4.encrypt | Encrypts using the RC4 algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.RC4.decrypt | Decrypts using the RC4 algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.algo.RC4.createEncryptor | Creates a password in RC4 encryption mode. | function | no | yes | | #### RC4Drop @@ -444,11 +444,11 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| :---------------------------- | ------------------------------- | -------- | -------- | ----------------- | ------------------------------------------------------------------------------ | -| C.RC4Drop.encrypt | RC4Drop算法加密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.RC4Drop.decrypt | RC4Drop算法解密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.algo.RC4Drop.createEncrypto | 在RC4Drop加密模式下创建此密码。 | function | no | yes | | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| :---------------------------- | ---------------------------------------------- | -------- | -------- | ----------------- | ------------------------------------------------------------ | +| C.RC4Drop.encrypt | Encrypts using the RC4Drop algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.RC4Drop.decrypt | Decrypts using the RC4Drop algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.algo.RC4Drop.createEncrypto | Creates a password in RC4Drop encryption mode. | function | no | yes | | #### Rabbit @@ -456,11 +456,11 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| :---------------------------- | ------------------------------ | -------- | -------- | ----------------- | ------------------------------------------------------------------------------ | -| C.Rabbit.encrypt | Rabbit算法加密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.Rabbit.decrypt | Rabbit算法解密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.algo.Rabbit.createEncryptor | 在Rabbit加密模式下创建此密码。 | function | no | yes | | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| :---------------------------- | --------------------------------------------- | -------- | -------- | ----------------- | ------------------------------------------------------------ | +| C.Rabbit.encrypt | Encrypts using the Rabbit algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.Rabbit.decrypt | Decrypts using the Rabbit algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.algo.Rabbit.createEncryptor | Creates a password in Rabbit encryption mode. | function | no | yes | | #### RabbitLegacy @@ -468,11 +468,11 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| :---------------------------------- | ------------------------------------ | -------- | -------- | ----------------- | ------------------------------------------------------------------------------ | -| C.RabbitLegacy.encrypt | RabbitLegacy算法加密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.RabbitLegacy.decrypt | RabbitLegacy算法解密。 | function | no | partially | 密码必须使用WordArray格式参数，不支持设置为string类型(与android/ios效果一致)。 | -| C.algo.RabbitLegacy.createEncryptor | 在RabbitLegacy加密模式下创建此密码。 | function | no | yes | | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| :---------------------------------- | --------------------------------------------------- | -------- | -------- | ----------------- | ------------------------------------------------------------ | +| C.RabbitLegacy.encrypt | Encrypts using the RabbitLegacy algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.RabbitLegacy.decrypt | Decrypts using the RabbitLegacy algorithm. | function | no | partially | The password must be in the **WordArray** format and cannot be set to the string type (same as Android and iOS). | +| C.algo.RabbitLegacy.createEncryptor | Creates a password in RabbitLegacy encryption mode. | function | no | yes | | #### Cipher @@ -480,20 +480,20 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :------ | ------------------------------------ | ------ | -------- | ----------------- | -| keySize | 此密码的密钥大小。缺省值：4（128位） | number | no | yes | -| ivSize | 此密码的Iv大小。缺省值：4（128位） | number | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :------ | --------------------------------------------------------- | ------ | -------- | ----------------- | +| keySize | Key size of the password. Default value: **4 (128 bits)** | number | no | yes | +| ivSize | IV size of the password. Default value: **4 (128 bits)** | number | no | yes | **API** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :------- | ------------------------------------------------------------------------------ | -------- | -------- | ----------------- | -| reset | 将此密码重置为其初始状态。 | function | no | yes | -| process | 添加需要加解密的数据。 | function | no | yes | -| finalize | 完成加密或解密过程。 请注意，finally操作实际上是一个破坏性的、一次读取的操作。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| reset | Resets the password to the initial state. | function | no | yes | +| process | Adds data to be encrypted or decrypted. | function | no | yes | +| finalize | Finalizes encryption or decryption. Note that this is a destructive and read-once operation. | function | no | yes | #### Blowfish @@ -501,10 +501,10 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :----------------- | -------------- | -------- | -------- | ----------------- | -| C.Blowfish.encrypt | Blowfish加密。 | function | no | yes | -| C.Blowfish.decrypt | Blowfish解密。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :----------------- | -------------------------------------- | -------- | -------- | ----------------- | +| C.Blowfish.encrypt | Encrypts using the Blowfish algorithm. | function | no | yes | +| C.Blowfish.decrypt | Decrypts using the Blowfish algorithm. | function | no | yes | #### SerializableCipher @@ -512,10 +512,10 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :------------------------------- | -------------------- | -------- | -------- | ----------------- | -| C.lib.SerializableCipher.encrypt | 对信息进行加密。 | function | no | yes | -| C.lib.SerializableCipher.decrypt | 对加密信息进行解密。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :------------------------------- | ----------------------------------- | -------- | -------- | ----------------- | +| C.lib.SerializableCipher.encrypt | Encrypts information. | function | no | yes | +| C.lib.SerializableCipher.decrypt | Decrypts the encrypted information. | function | no | yes | #### PasswordBasedCipher @@ -523,10 +523,10 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| :-------------------------------- | -------------------- | -------- | -------- | ----------------- | ----------------------------------------------------------------------- | -| C.lib.PasswordBasedCipher.encrypt | 对信息进行加密。 | function | no | partially | 必须传入有效的salt参数，不传入salt参数时不支持(与android/ios效果一致)。 | -| C.lib.PasswordBasedCipher.decrypt | 对加密信息进行解密。 | function | no | partially | 必须传入有效的salt参数，不传入salt参数时不支持(与android/ios效果一致)。 | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| :-------------------------------- | ----------------------------------- | -------- | -------- | ----------------- | ------------------------------------------------------------ | +| C.lib.PasswordBasedCipher.encrypt | Encrypts information. | function | no | partially | A valid **salt** parameter must be passed in. Otherwise, the HarmonyOS platform does not support (same as Android and iOS). | +| C.lib.PasswordBasedCipher.decrypt | Decrypts the encrypted information. | function | no | partially | A valid **salt** parameter must be passed in. Otherwise, the HarmonyOS platform does not support (same as Android and iOS). | #### kdf.OpenSSL @@ -534,9 +534,9 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| :-------------------- | -------------------- | -------- | -------- | ----------------- | ----------------------------------------------------------------------- | -| C.kdf.OpenSSL.execute | 从密码派生密钥和IV。 | function | no | partially | 必须传入有效的salt参数，不传入salt参数时不支持(与android/ios效果一致)。 | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| :-------------------- | ----------------------------------------- | -------- | -------- | ----------------- | ------------------------------------------------------------ | +| C.kdf.OpenSSL.execute | Derives the key and IV from the password. | function | no | partially | A valid **salt** parameter must be passed in. Otherwise, the HarmonyOS platform does not support (same as Android and iOS). | #### kdf.PBKDF2 @@ -544,18 +544,18 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :------------------- | ---------------------------------- | -------- | -------- | ----------------- | -| C.algo.PBKDF2.create | 初始化PBKDF2新创建的密钥推导函数。 | function | no | yes | -| C.PBKDF2 | PBKDF2派生密钥。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :------------------- | ---------------------------------------------------------- | -------- | -------- | ----------------- | +| C.algo.PBKDF2.create | Initializes the key derivation function created by PBKDF2. | function | no | yes | +| C.PBKDF2 | Derives key by PBKDF2. | function | no | yes | **API** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :------ | ---------------------------------- | -------- | -------- | ----------------- | -| compute | 计算基于PBKDF2密码的密钥派生函数。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :------ | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| compute | Computes the key derivation function based on the PBKDF2 password. | function | no | yes | #### EvpKDF @@ -563,19 +563,19 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :------------------- | ---------------------------------- | -------- | -------- | ----------------- | -| C.algo.EvpKDF.create | 初始化EvpKDF新创建的密钥推导函数。 | function | no | yes | -| C.EvpKDF | EvpKDF派生密钥。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :------------------- | ---------------------------------------------------------- | -------- | -------- | ----------------- | +| C.algo.EvpKDF.create | Initializes the key derivation function created by EvpKDF. | function | no | yes | +| C.EvpKDF | Derives key by EvpKDF. | function | no | yes | **API** > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :------ | ---------------------------------- | -------- | -------- | ----------------- | -| compute | 计算基于EvpKDF密码的密钥派生函数。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :------ | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| compute | Computes the key derivation function based on the EvpKDF password. | function | no | yes | #### format @@ -583,12 +583,12 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :------------------------- | ------------------------------------------- | -------- | -------- | ----------------- | -| C.format.OpenSSL.stringify | 将CipherParams对象转换为OpenSSL兼容字符串。 | function | no | yes | -| C.format.OpenSSL.parse | 将OpenSSL兼容字符串转换为CipherParams对象。 | function | no | yes | -| C.format.Hex.stringify | 将CipherParams对象转换为16进制字符串。 | function | no | yes | -| C.format.Hex.parse | 将16进制字符串转换为CipherParams对象。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :------------------------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| C.format.OpenSSL.stringify | Converts the **CipherParams** object to an OpenSSL-compatible string. | function | no | yes | +| C.format.OpenSSL.parse | Converts an OpenSSL-compatible string to the **CipherParams** object. | function | no | yes | +| C.format.Hex.stringify | Converts the **CipherParams** object into a hexadecimal string. | function | no | yes | +| C.format.Hex.parse | Converts a hexadecimal string into the **CipherParams** object. | function | no | yes | #### enc/Encoder @@ -596,24 +596,24 @@ import C from "crypto-js"; > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | -| :------------------------ | ------------------------------------- | -------- | -------- | ----------------- | -| C.enc.Hex.stringify | 将字节数组转换为十六进制字符串。 | function | no | yes | -| C.enc.Hex.parse | 将十六进制字符串转换为字节数组。 | function | no | yes | -| C.enc.Latin1.stringify | 将字节数组转换为Latin1格式字符串。 | function | no | yes | -| C.enc.Latin1.parse | 将Latin1格式字符串转换为字节数组。 | function | no | yes | -| C.enc.Utf8.stringify | 将字节数组转换为UTF-8格式字符串。 | function | no | yes | -| C.enc.Utf8.parse | 将UTF-8格式字符串转换为字节数组。 | function | no | yes | -| C.enc.Utf16.stringify | 将字节数组转换为UTF-16格式字符串。 | function | no | yes | -| C.enc.Utf16.parse | 将UTF-16格式字符串转换为字节数组。 | function | no | yes | -| C.enc.Utf16BE.stringify | 将字节数组转换为UTF-16 BE格式字符串。 | function | no | yes | -| C.enc.Utf16BE.parse | 将UTF-16 BE格式字符串转换为字节数组。 | function | no | yes | -| C.enc.Utf16LE.stringify | 将字节数组转换为UTF-16 LE格式字符串。 | function | no | yes | -| C.enc.Utf16LE.parse | 将UTF-16 LE格式字符串转换为字节数组。 | function | no | yes | -| C.enc.Base64.stringify | 将字节数组转换为Base64格式字符串。 | function | no | yes | -| C.enc.Base64.parse | 将Base64格式字符串转换为字节数组。 | function | no | yes | -| C.enc.Base64url.stringify | 将字节数组转换为Base64url格式字符串。 | function | no | yes | -| C.enc.Base64url.parse | 将Base64url格式字符串转换为字节数组。 | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| :------------------------ | ---------------------------------------------------------- | -------- | -------- | ----------------- | +| C.enc.Hex.stringify | Converts a byte array into a hexadecimal string. | function | no | yes | +| C.enc.Hex.parse | Converts a hexadecimal string into a byte array. | function | no | yes | +| C.enc.Latin1.stringify | Converts a byte array into an ISO-8859-1-encoded C string. | function | no | yes | +| C.enc.Latin1.parse | Converts an ISO-8859-1-encoded C string into a byte array. | function | no | yes | +| C.enc.Utf8.stringify | Converts a byte array into a UTF-8-encoded string. | function | no | yes | +| C.enc.Utf8.parse | Converts a UTF-8-encoded string into a byte array. | function | no | yes | +| C.enc.Utf16.stringify | Converts a byte array into a UTF-16-encoded string. | function | no | yes | +| C.enc.Utf16.parse | Converts a UTF-16-encoded string into a byte array. | function | no | yes | +| C.enc.Utf16BE.stringify | Converts a byte array into a UTF-16BE-encoded string. | function | no | yes | +| C.enc.Utf16BE.parse | Converts a UTF-16BE-encoded string into a byte array. | function | no | yes | +| C.enc.Utf16LE.stringify | Converts a byte array into a UTF-16LE-encoded string. | function | no | yes | +| C.enc.Utf16LE.parse | Converts a UTF-16LE-encoded string into a byte array. | function | no | yes | +| C.enc.Base64.stringify | Converts a byte array into a Base64-encoded string. | function | no | yes | +| C.enc.Base64.parse | Converts a Base64-encoded string into a byte array. | function | no | yes | +| C.enc.Base64url.stringify | Converts a byte array into a Base64URL-encoded string. | function | no | yes | +| C.enc.Base64url.parse | Converts a Base64URL-encoded string into a byte array. | function | no | yes | ## Known Issues @@ -621,4 +621,4 @@ import C from "crypto-js"; ## License -This project is licensed under [MIT License](https://github.com/brix/crypto-js/blob/4.2.0/LICENSE), Please enjoy and participate freely in open source. +This project is licensed under [MIT License](https://github.com/brix/crypto-js/blob/4.2.0/LICENSE). diff --git a/en/js/jsbarcode.md b/en/js/jsbarcode.md index 4c1052b8..c347d137 100644 --- a/en/js/jsbarcode.md +++ b/en/js/jsbarcode.md @@ -41,9 +41,9 @@ import JsBarCode from 'jsbarcode'; The following code shows the basic use scenario of the repository: -### **With svg:** +### **With svg** -> [!TIP] [jsbarcode库依赖react-native-svg库进行条形码展示, svg 当前仅实现部分属性，其余还未实现 HarmonyOS 化] > [!TIP] [详见react-native-svg](https://gitee.com/react-native-oh-library/usage-docs/blob/master/zh-cn/react-native-svg.md) +> [!TIP] The jsbarcode library depends on the react-native-svg library to display barcodes. Currently, only some properties of the svg library are supported on HarmonyOS. For details, see the [react-native-svg](https://gitee.com/react-native-oh-library/usage-docs/blob/master/en/react-native-svg.md) library. ```tsx import {ScrollView, StyleSheet, View, Text} from 'react-native'; @@ -169,9 +169,9 @@ const styles = StyleSheet.create({ }); ``` -### **With canvas:** +### **With Canvas** -> [!TIP] [react-native-canvas库暂未 HarmonyOS 化，当前无法使用canvas渲染，下面用法仅供参考] +> [!TIP] The react-native-canvas library is not supported on HarmonyOS yet and cannot be rendered using **Canvas**. The following usage is for reference only. ```js var JsBarcode = require("jsbarcode"); @@ -290,35 +290,35 @@ This document is verified based on the following versions: > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | HarmonyOS Support | Remark | -| ------------ | ----------------- | ------------------ | -------- | ----------------- | --------------------------------------------------------------------- | -| format | "auto" (CODE128) | String | no | yes | | -| width | 2 | Number | no | yes | | -| height | 100 | Number | no | yes | | -| displayValue | true | Boolean | no | yes | | -| text | undefined | String | no | yes | | -| fontOptions | "" | String | no | yes | react-native-svg目前不支持fontOptions: 'italic'，导致条形码效果不生效 | -| font | "monospace" | String | no | yes | react-native-svg目前不支持font设置，导致条形码效果不生效 | -| textAlign | "center" | String | no | yes | | -| textPosition | "bottom" | String | no | yes | | -| textMargin | 2 | Number | no | yes | | -| fontSize | 20 | Number | no | yes | | -| background | "#ffffff" | String (CSS color) | no | yes | | -| lineColor | "#000000" | String (CSS color) | no | yes | | -| margin | 10 | Number | no | yes | | -| marginTop | undefined | Number | no | yes | | -| marginBottom | undefined | Number | no | yes | | -| marginLeft | undefined | Number | no | yes | | -| marginRight | undefined | Number | no | yes | | -| flat | false | Boolean | no | yes | 仅支持format：EAN8/EAN13 | -| valid | function(valid){} | Function | no | yes | | +| Name | Description | Type | Required | HarmonyOS Support | Remark | +| ------------ | ----------------- | ------------------ | -------- | ----------------- | ------------------------------------------------------------ | +| format | "auto" (CODE128) | String | no | yes | | +| width | 2 | Number | no | yes | | +| height | 100 | Number | no | yes | | +| displayValue | true | Boolean | no | yes | | +| text | undefined | String | no | yes | | +| fontOptions | "" | String | no | yes | Currently, the react-native-svg library does not support **fontOptions: 'italic'**. As a result, the barcode effect does not take effect. | +| font | "monospace" | String | no | yes | Currently, the react-native-svg library does not support **font**. As a result, the barcode effect does not take effect. | +| textAlign | "center" | String | no | yes | | +| textPosition | "bottom" | String | no | yes | | +| textMargin | 2 | Number | no | yes | | +| fontSize | 20 | Number | no | yes | | +| background | "#ffffff" | String (CSS color) | no | yes | | +| lineColor | "#000000" | String (CSS color) | no | yes | | +| margin | 10 | Number | no | yes | | +| marginTop | undefined | Number | no | yes | | +| marginBottom | undefined | Number | no | yes | | +| marginLeft | undefined | Number | no | yes | | +| marginRight | undefined | Number | no | yes | | +| flat | false | Boolean | no | yes | Only the EAN8 or EAN13 format is supported. | +| valid | function(valid){} | Function | no | yes | | ## Known Issues -jsbarcode库依赖react-native-svg库进行条形码展示, 因svg 当前仅实现部分属性，其余还未实现 HarmonyOS 化，目前在HarmonyOS上条形码的文本位置效果不对，fontSize显示比较小。 +The jsbarcode library depends on the react-native-svg library to display barcodes. Currently, only some properties of the svg library are supported on HarmonyOS. Therefore, the barcode position displayed on HarmonyOS is incorrect, and the font size is small. ## Others ## License -This project is licensed under [MIT License](https://github.com/lindell/JsBarcode/blob/master/MIT-LICENSE.txt), Please enjoy and participate freely in open source. +This project is licensed under [MIT License](https://github.com/lindell/JsBarcode/blob/master/MIT-LICENSE.txt). \ No newline at end of file diff --git a/en/js/moment.md b/en/js/moment.md index 91a5cf71..c5dfdf8e 100644 --- a/en/js/moment.md +++ b/en/js/moment.md @@ -31,7 +31,7 @@ yarn add moment@2.30.1 -quick use： +quick use: ```bash import moment from 'moment'; @@ -52,209 +52,209 @@ moment.locale('zh-cn'); This document is verified based on the following versions: -1. RNOH：0.72.20; SDK：HarmonyOS NEXT Developer Preview2; IDE：DevEco Studio 5.0.3.200; ROM：205.0.0.18; +1. RNOH: 0.72.20; SDK: HarmonyOS NEXT Developer Preview2; IDE: DevEco Studio 5.0.3.200; ROM: 205.0.0.18; -## API +## APIs -详情请查看[moment官方文档](https://momentjs.com/docs/#/use-it/) +For details, see the [Moment.js Documentation](https://momentjs.com/docs/#/use-it/). -以下moment为moment.js导出的对象，即： +The following **moment** is the object exported from **moment.js**: ```bash import moment from 'moment'; ``` -The following code shows the basic use scenario of the repository: +The following code shows the basic use scenarios of the repository: ```js -// 获取今天0时0分0秒 +// Obtain 00:00:00 today. moment().startOf("day"); -// 获取当前月第一天0时0分0秒 +// Obtain 00:00:00 in the first day of the current month. moment().startOf("month"); -// 获取当前月的总天数 +// Obtain the total number of days of the current month. moment().daysInMonth(); -// 获取时间戳(以秒为单位) -moment().format("X"); // 返回值为字符串类型 -moment().unix(); // 返回值为数值型 -// 获取时间戳(以毫秒为单位) -moment().format("x"); // 返回值为字符串类型 -moment().valueOf(); // 返回值为数值型 -// 获取年份 +// Obtain the timestamp (in seconds). +moment().format("X"); // The return value is of the string type. +moment().unix (); // The return value is of the numeric type. +// Obtain the timestamp (in milliseconds). +moment().format("x"); // The return value is of the string type. +moment().valueOf(); // The return value is of the numeric type. +// Obtain the year. moment().year(); moment().get("year"); -// 获取月份 +// Obtain the month. moment().month(); // (0~11, 0: January, 11: December) moment().get("month"); -// 获取一个星期中的某一天 +// Obtain a day in a week. moment().date(); moment().get("date"); -// 获取小时 +// Obtain the hour. moment().hours(); moment().get("hours"); -// 获取分钟 +// Obtain the minute. moment().minutes(); moment().get("minutes"); -// 获取当前的年月日时分秒 +// Obtain the current year, month, day, hour, minute, second, and millisecond. moment().toArray(); // [years, months, date, hours, minutes, seconds, milliseconds] moment().toObject(); // {years: xxxx, months: x, date: xx ...} -// 设置年份 +// Set the year. moment().year(2019); moment().set("year", 2019); moment().set({ year: 2019 }); -// 设置月份 +// Set the month. moment().month(11); // (0~11, 0: January, 11: December) moment().set("month", 11); -// 设置某个月中的某一天 +// Set a day in a month. moment().date(15); moment().set("date", 15); -// 设置某个星期中的某一天 -moment().weekday(0); // 设置日期为本周第一天（周日） -moment().isoWeekday(1); // 设置日期为本周周一 +// Set a day in a week. +moment().weekday(0); // Set the date to the first day (Sunday) of this week. +moment().isoWeekday(1); // Set the date to Monday of this week. moment().set("weekday", 0); moment().set("isoWeekday", 1); -// 设置小时 +// Set the hour. moment().hours(12); moment().set("hours", 12); -// 年份+1 +// Plus one year base on this year. moment().add(1, "years"); moment().add({ years: 1 }); -// 获取两个日期之间的时间差 +// Obtain the time difference between two dates. let start_date = moment().subtract(1, "weeks"); let end_date = moment(); -end_date.diff(start_date); // 返回毫秒数 +end_date.diff(start_date); // Return the number of milliseconds. end_date.diff(start_date, "months"); // 0 end_date.diff(start_date, "weeks"); // 1 end_date.diff(start_date, "days"); // 7 start_date.diff(end_date, "days"); // -7 -// 转化为JavaScript原生Date对象 +// Convert the moment object to a native JavaScript Date object. moment().toDate(); new Date(moment()); -// 格式化年月日： 'xxxx年xx月xx日' -moment().format("YYYY年MM月DD日"); -// 格式化年月日： 'xxxx-xx-xx' +// Set the year, month, and day to the "MM DD, YYYY" format. +moment().format("MM DD, YYYY"); +// Set the year, month, and day to the "YYYY-MM-DD" format. moment().format("YYYY-MM-DD"); -// 格式化时分秒(24小时制)： 'xx时xx分xx秒' -moment().format("HH时mm分ss秒"); -// 格式化时分秒(12小时制)：'xx:xx:xx am/pm' +// Set the hour, minute, and second to the 24-hour clock format. +moment().format("HH:mm:ss"); +// Set the hour, minute, and second to the 12-hour clock format. moment().format("hh:mm:ss a"); ``` -如下是已验证接口展示: +The following shows the verified APIs: -> [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。 +> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. #### **Get + Set** -| Name | Description | Type | Required | HarmonyOS Support | -| ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -------- | ----------------- | -| millisecond | Gets or sets the milliseconds. | function | no | yes | -| second | Gets or sets the seconds. | function | no | yes | -| minute | Gets or sets the minutes. | function | no | yes | -| hour | Gets or sets the hour. | function | no | yes | -| date | Gets or sets the day of the month | function | no | yes | -| day | Gets or sets the day of the week. | function | no | yes | -| weekday | Gets or sets the day of the week according to the locale. | function | no | yes | -| isoWeekday | Gets or sets the ISO day of the week with 1 being Monday and 7 being Sunday. | function | no | yes | -| dayOfYear | Gets or sets the day of the year. | function | no | yes | -| week | Gets or sets the week of the year. | function | no | yes | -| isoWeek | Gets or sets the ISO week of the year. | function | no | yes | -| month | Gets or sets the month. | function | no | yes | -| quarter | Gets the quarter (1 to 4). | function | no | yes | -| year | Gets or sets the year. | function | no | yes | -| weekYear | Gets or sets the week-year according to the locale. | function | no | yes | -| isoWeekYear | Gets or sets the ISO week-year. | function | no | yes | -| weeksInYear | Gets the number of weeks according to locale in the current moment's year. | function | no | yes | -| isoWeeksInYea | Gets the number of weeks in the current moment's year, according to ISO weeks. | function | no | yes | -| get | String getter. In general
Units are case insensitive, and support plural and short forms: year (years, y), month (months, M), date (dates, D), hour (hours, h), minute (minutes, m), second (seconds, s), millisecond (milliseconds, ms). | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ------------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| millisecond | Gets or sets the milliseconds. | function | no | yes | +| second | Gets or sets the seconds. | function | no | yes | +| minute | Gets or sets the minutes. | function | no | yes | +| hour | Gets or sets the hour. | function | no | yes | +| date | Gets or sets the day of the month | function | no | yes | +| day | Gets or sets the day of the week. | function | no | yes | +| weekday | Gets or sets the day of the week according to the locale. | function | no | yes | +| isoWeekday | Gets or sets the ISO day of the week with 1 being Monday and 7 being Sunday. | function | no | yes | +| dayOfYear | Gets or sets the day of the year. | function | no | yes | +| week | Gets or sets the week of the year. | function | no | yes | +| isoWeek | Gets or sets the ISO week of the year. | function | no | yes | +| month | Gets or sets the month. | function | no | yes | +| quarter | Gets the quarter (1 to 4). | function | no | yes | +| year | Gets or sets the year. | function | no | yes | +| weekYear | Gets or sets the week-year according to the locale. | function | no | yes | +| isoWeekYear | Gets or sets the ISO week-year. | function | no | yes | +| weeksInYear | Gets the number of weeks according to locale in the current moment's year. | function | no | yes | +| isoWeeksInYea | Gets the number of weeks in the current moment's year, according to ISO weeks. | function | no | yes | +| get | String getter. In general
Units are case insensitive, and support plural and short forms: year (years, y), month (months, M), date (dates, D), hour (hours, h), minute (minutes, m), second (seconds, s), millisecond (milliseconds, ms). | function | no | yes | | set | Generic setter, accepting unit as first argument, and value as second:
Units are case insensitive, and support plural and short forms: year (years, y), month (months, M), date (dates, D), hour (hours, h), minute (minutes, m), second (seconds, s), millisecond (milliseconds, ms). | function | no | yes | #### **Manipulate** -| Name | Description | Type | Required | HarmonyOS Support | -| --------- | --------------------------------------------------------------------------------------------------------------- | -------- | -------- | ----------------- | -| add | Mutates the original moment by adding time. | function | no | yes | -| subtract | Mutates the original moment by subtracting time. | function | no | yes | -| startOf | Mutates the original moment by setting it to the start of a unit of time. | function | no | yes | -| endOf | Mutates the original moment by setting it to the end of a unit of time. | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| --------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| add | Mutates the original moment by adding time. | function | no | yes | +| subtract | Mutates the original moment by subtracting time. | function | no | yes | +| startOf | Mutates the original moment by setting it to the start of a unit of time. | function | no | yes | +| endOf | Mutates the original moment by setting it to the end of a unit of time. | function | no | yes | | local | Sets a flag on the original moment to use local time to display a moment instead of the original moment's time. | function | no | yes | -| utc | Sets a flag on the original moment to use UTC to display a moment instead of the original moment's time. | function | no | yes | -| utcOffset | Get or set the UTC offset in minutes. | function | no | yes | +| utc | Sets a flag on the original moment to use UTC to display a moment instead of the original moment's time. | function | no | yes | +| utcOffset | Get or set the UTC offset in minutes. | function | no | yes | #### **Display** -| Name | Description | Type | Required | HarmonyOS Support | -| ----------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -------- | ----------------- | -| format | This is the most robust display option. It takes a string of tokens and replaces them with their corresponding values. | function | no | yes | -| fromNow | A common way of displaying time is handled by moment#fromNow. This is sometimes called timeago or relative time. | function | no | yes | -| from | You may want to display a moment in relation to a time other than now. In that case, you can use moment#from. | function | no | yes | -| toNow | A common way of displaying time is handled by moment#toNow. This is sometimes called timeago or relative time. | function | no | yes | -| to | You may want to display a moment in relation to a time other than now. In that case, you can use moment#to. | function | no | yes | -| calendar | Calendar time displays time relative to a given referenceDay (defaults to the start of today), but does so slightly differently than moment#fromNow. | function | no | yes | -| diff | To get the difference in milliseconds, use moment#diff like you would use moment#from. | function | no | yes | -| valueOf | moment#valueOf simply outputs the number of milliseconds since the Unix Epoch, just like Date#valueOf. | function | no | yes | -| unix | moment#unix outputs a Unix timestamp (the number of seconds since the Unix Epoch). | function | no | yes | -| daysInMonth | Get the number of days in the current month. | function | no | yes | -| toDate | To get a copy of the native Date object that Moment.js wraps, use moment#toDate. | function | no | yes | -| toArray | This returns an array that mirrors the parameters from new Date(). | function | no | yes | -| toJSON | When serializing an object to JSON, if there is a Moment object, it will be represented as an ISO8601 string, adjusted to UTC. | function | no | yes | -| toISOString | Formats a string to the ISO8601 standard. | function | no | yes | -| toObject | This returns an object containing year, month, day-of-month, hour, minute, seconds, milliseconds. | function | no | yes | -| toString | Returns an english string in a similar format to JS Date's .toString(). | function | no | yes | -| inspect | Returns a machine readable string, that can be evaluated to produce the same moment. Because of the name it's also used in node interactive shell to display objects. | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ----------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| format | This is the most robust display option. It takes a string of tokens and replaces them with their corresponding values. | function | no | yes | +| fromNow | A common way of displaying time is handled by moment#fromNow. This is sometimes called timeago or relative time. | function | no | yes | +| from | You may want to display a moment in relation to a time other than now. In that case, you can use moment#from. | function | no | yes | +| toNow | A common way of displaying time is handled by moment#toNow. This is sometimes called timeago or relative time. | function | no | yes | +| to | You may want to display a moment in relation to a time other than now. In that case, you can use moment#to. | function | no | yes | +| calendar | Calendar time displays time relative to a given referenceDay (defaults to the start of today), but does so slightly differently than moment#fromNow. | function | no | yes | +| diff | To get the difference in milliseconds, use moment#diff like you would use moment#from. | function | no | yes | +| valueOf | moment#valueOf simply outputs the number of milliseconds since the Unix Epoch, just like Date#valueOf. | function | no | yes | +| unix | moment#unix outputs a Unix timestamp (the number of seconds since the Unix Epoch). | function | no | yes | +| daysInMonth | Get the number of days in the current month. | function | no | yes | +| toDate | To get a copy of the native Date object that Moment.js wraps, use moment#toDate. | function | no | yes | +| toArray | This returns an array that mirrors the parameters from new Date(). | function | no | yes | +| toJSON | When serializing an object to JSON, if there is a Moment object, it will be represented as an ISO8601 string, adjusted to UTC. | function | no | yes | +| toISOString | Formats a string to the ISO8601 standard. | function | no | yes | +| toObject | This returns an object containing year, month, day-of-month, hour, minute, seconds, milliseconds. | function | no | yes | +| toString | Returns an english string in a similar format to JS Date's .toString(). | function | no | yes | +| inspect | Returns a machine readable string, that can be evaluated to produce the same moment. Because of the name it is also used in node interactive shell to display objects. | function | no | yes | #### **Query** -| Name | Description | Type | Required | HarmonyOS Support | -| -------------- | ---------------------------------------------------------------------------------------------------------------------------- | -------- | -------- | ----------------- | -| isBefore | Check if a moment is before another moment. The first argument will be parsed as a moment, if not already so. | function | no | yes | -| isSame | Check if a moment is the same as another moment. The first argument will be parsed as a moment, if not already so. | function | no | yes | -| isAfter | Check if a moment is after another moment. The first argument will be parsed as a moment, if not already so. | function | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| -------------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| isBefore | Check if a moment is before another moment. The first argument will be parsed as a moment, if not already so. | function | no | yes | +| isSame | Check if a moment is the same as another moment. The first argument will be parsed as a moment, if not already so. | function | no | yes | +| isAfter | Check if a moment is after another moment. The first argument will be parsed as a moment, if not already so. | function | no | yes | | isSameOrBefore | Check if a moment is before or the same as another moment. The first argument will be parsed as a moment, if not already so. | function | no | yes | -| isSameOrAfter | Check if a moment is after or the same as another moment. The first argument will be parsed as a moment, if not already so. | function | no | yes | -| isBetween | Check if a moment is between two other moments, optionally looking at unit scale (minutes, hours, days, etc). | function | no | yes | -| isDST | moment#isDST checks if the current moment is in daylight saving time. | function | no | yes | -| isLeapYear | moment#isLeapYear returns true if that year is a leap year, and false if it is not. | function | no | yes | -| isMoment | To check if a variable is a moment object, use moment.isMoment(). | function | no | yes | -| isDate | To check if a variable is a native js Date object, use moment.isDate(). | function | no | yes | +| isSameOrAfter | Check if a moment is after or the same as another moment. The first argument will be parsed as a moment, if not already so. | function | no | yes | +| isBetween | Check if a moment is between two other moments, optionally looking at unit scale (minutes, hours, days, etc). | function | no | yes | +| isDST | moment#isDST checks if the current moment is in daylight saving time. | function | no | yes | +| isLeapYear | moment#isLeapYear returns true if that year is a leap year, and false if it is not. | function | no | yes | +| isMoment | To check if a variable is a moment object, use moment.isMoment(). | function | no | yes | +| isDate | To check if a variable is a native js Date object, use moment.isDate(). | function | no | yes | #### **Durations** -| Name | Description | Type | Required | HarmonyOS Support | -| -------- | ------------------------------------------------------------------------------------- | -------- | -------- | ----------------- | +| Name | Description | Type | Required | HarmonyOS Support | +| -------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | | duration | To create a duration, call moment.duration() with the length of time in milliseconds. | function | no | yes | -#### **格式化时间** - -| **格式代码** | **说明** | **返回值例子** | -| ------------ | -------------------------- | -------------------------- | -| M | 数字表示的月份，没有前导零 | 1到12 | -| MM | 数字表示的月份，有前导零 | 01到12 | -| MMM | 三个字母缩写表示的月份 | Jan到Dec | -| MMMM | 月份，完整的文本格式 | January到December | -| Q | 季度 | 1到4 | -| D | 月份中的第几天，没有前导零 | 1到31 | -| DD | 月份中的第几天，有前导零 | 01到31 | -| d | 星期中的第几天，数字表示 | 0到6，0表示周日，6表示周六 | -| ddd | 三个字母表示星期中的第几天 | Sun到Sat | -| dddd | 星期几，完整的星期文本 | 从Sunday到Saturday | -| w | 年份中的第几周 | 如42：表示第42周 | -| YYYY | 四位数字完整表示的年份 | 如：2014 或 2000 | -| YY | 两位数字表示的年份 | 如：14 或 98 | -| A | 大写的AM PM | AM PM | -| a | 小写的am pm | am pm | -| HH | 小时，24小时制，有前导零 | 00到23 | -| H | 小时，24小时制，无前导零 | 0到23 | -| hh | 小时，12小时制，有前导零 | 00到12 | -| h | 小时，12小时制，无前导零 | 0到12 | -| m | 没有前导零的分钟数 | 0到59 | -| mm | 有前导零的分钟数 | 00到59 | -| s | 没有前导零的秒数 | 1到59 | -| ss | 有前导零的描述 | 01到59 | -| X | Unix时间戳 | 1411572969 | +#### **Formatted time** + +| **Format Code** | **Description** | **Return Value** | +| --------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | +| M | Month represented by a number, without a leading zero. | The value ranges from 1 to 12. | +| MM | Month represented by a number, with a leading zero. | The value ranges from 01 to 12. | +| MMM | Month represented by a three-letter abbreviation. | The value ranges from Jan to Dec. | +| MMMM | Month, in its full name. | January to December. | +| Q | Quarter. | The value ranges from 1 to 4. | +| D | Day of the month, without a leading zero. | The value ranges from 1 to 31. | +| DD | Day of the month, with a leading zero. | The value ranges from 01 to 31. | +| d | Day of the week, represented by a number. | The value ranges from 0 to 6. The value **0** indicates Sunday, and **6** indicates Saturday. | +| ddd | Day of the week, represented by a three-letter abbreviation. | The value ranges from Sun to Sat. | +| dddd | Day of the week, in its full name. | The value ranges from Sunday to Saturday. | +| w | Week of a year. | For example, **42** indicates the 42nd week. | +| YYYY | Year represented by four digits. | For example, **2014** or **2000**. | +| YY | Year represented by two digits. | For example, **14** or **98**. | +| A | Uppercase of the time units. | AM or PM. | +| a | Lowercase of the time units. | am or pm. | +| HH | Hour, in 24-hour clock, with a leading zero. | The value ranges from 00 to 23. | +| H | Hour, in 24-hour clock, without a leading zero. | The value ranges from 0 to 23. | +| hh | Hour, in 12-hour clock, with a leading zero. | The value ranges from 00 to 12. | +| h | Hour, in 12-hour clock, without a leading zero. | The value ranges from 0 to 12. | +| m | Minute, without a leading zero. | The value ranges from 0 to 59. | +| mm | Minute, with a leading zero. | The value ranges from 00 to 59. | +| s | Second, without a leading zero. | The value ranges from 1 to 59. | +| ss | Second, with a leading zero. | The value ranges from 01 to 59. | +| X | Unix timestamp. | For example, **1411572969**. | ## Others -## License +## License \ No newline at end of file diff --git a/en/js/prop-types.md b/en/js/prop-types.md index f474ef13..56559f22 100644 --- a/en/js/prop-types.md +++ b/en/js/prop-types.md @@ -86,32 +86,32 @@ export default App; This document is verified based on the following versions: -1. RNOH：0.72.11; SDK：OpenHarmony(api11) 4.1.0.53; IDE：DevEco Studio 4.1.3.412; ROM：2.0.0.52; -2. RNOH：0.72.13; SDK：HarmonyOS NEXT Developer Preview1; IDE：DevEco Studio 4.1.3.500; ROM：2.0.0.58; -3. RNOH：0.72.33; SDK：OpenHarmony 5.0.0.71(API Version 12 Release); IDE：DevEco Studio 5.0.3.900; ROM：NEXT.0.0.71; +1. RNOH: 0.72.11; SDK: OpenHarmony (api11) 4.1.0.53; IDE: DevEco Studio 4.1.3.412; ROM: 2.0.0.52; +2. RNOH: 0.72.13; SDK: HarmonyOS NEXT Developer Preview1; IDE: DevEco Studio 4.1.3.500; ROM: 2.0.0.58; +3. RNOH: 0.72.33; SDK: OpenHarmony 5.0.0.71 (API Version 12 Release); IDE: DevEco Studio 5.0.3.900; ROM: NEXT.0.0.71; #### Properties -| Name | Description | Type | Required | HarmonyOS Support | -| ----------- | ---------------------------------------------------- | --------- | -------- | -------- | -| any | 约束属性为任意类型 | Attribute | NO | yes | -| array | 约束属性为数组类型 | Attribute | NO | yes | -| bool | 约束属性为布尔值类型 | Attribute | NO | yes | -| func | 约束属性为函数类型 | Attribute | NO | yes | -| number | 约束属性为数字类型 | Attribute | NO | yes | -| object | 约束属性为对象类型 | Attribute | NO | yes | -| string | 约束属性为字符串类型 | Attribute | NO | yes | -| symbol | 约束属性为 symbol 类型 | Attribute | NO | yes | -| element | 约束属性为 react 元素 | Attribute | NO | yes | -| node | 约束属性为可以渲染的任何内容数字 字符串 元素 或 数组 | Attribute | NO | yes | -| elementType | 约束属性为 react 类型 | Attribute | NO | yes | -| instanceOf | 约束属性为某个对象的实例 | function | NO | yes | -| oneOf | 约束属性为给定值中的任意一个 | function | NO | yes | -| oneOfType | 约束属性为给定类型中的任意一个 | function | NO | yes | -| arrayOf | 约束属性为指定类型的数组 | function | NO | yes | -| objectOf | 约束属性为具有指定类型属性值的对象 | function | NO | yes | -| shape | 约束属性为指定构成方式的对象 | function | NO | yes | -| exact | 约束属性包含指定属性 | function | NO | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ----------- | ------------------------------------------------------------ | --------- | -------- | ----------------- | +| any | Any data type. | Attribute | NO | yes | +| array | The array type. | Attribute | NO | yes | +| bool | The Boolean type. | Attribute | NO | yes | +| func | The function type. | Attribute | NO | yes | +| number | The number type. | Attribute | NO | yes | +| object | The object type. | Attribute | NO | yes | +| string | The string type. | Attribute | NO | yes | +| symbol | The symbol type. | Attribute | NO | yes | +| element | The react element. | Attribute | NO | yes | +| node | Any content that can be rendered, such as a numeric string element, or an array. | Attribute | NO | yes | +| elementType | The react type. | Attribute | NO | yes | +| instanceOf | An instance of an object. | function | NO | yes | +| oneOf | One of the given values. | function | NO | yes | +| oneOfType | One of the specified types. | function | NO | yes | +| arrayOf | An array of the specified type. | function | NO | yes | +| objectOf | An object with the attribute value of the specified type. | function | NO | yes | +| shape | An object of the specified composition mode. | function | NO | yes | +| exact | A specified attribute that is contained. | function | NO | yes | ## Known Issues @@ -119,4 +119,4 @@ This document is verified based on the following versions: ## License -This project is licensed under [The MIT License (MIT)](https://github.com/facebook/prop-types/blob/v15.8.1/LICENSE). +This project is licensed under [The MIT License (MIT)](https://github.com/facebook/prop-types/blob/v15.8.1/LICENSE). \ No newline at end of file diff --git a/en/js/react-ahooks.md b/en/js/react-ahooks.md index 43ada9d9..b2112a36 100644 --- a/en/js/react-ahooks.md +++ b/en/js/react-ahooks.md @@ -13,19 +13,19 @@ > [!TIP] [GitHub address](https://github.com/alibaba/hooks) -## 📚 文档 +## 📚 Documents - [English](https://ahooks.js.org/) -- [中文](https://ahooks.js.org/zh-CN/) +- [Chinese](https://ahooks.js.org/zh-CN/) -## ✨ 特性 +## ✨ Features -- 易学易用 -- 支持 SSR -- 对输入输出函数做了特殊处理，避免闭包问题 -- 包含大量提炼自业务的高级 Hooks -- 包含丰富的基础 Hooks -- 使用 TypeScript 构建，提供完整的类型定义文件 +- Easy to learn and use. +- Supports SSR. +- Special processing for functions to avoid closure problems. +- Contains a large number of advanced Hooks that are extracted from services. +- Contains a comprehensive collection of basic Hooks. +- Written in TypeScript with a complete type definition file provided. ## 📦 Installation @@ -51,9 +51,6 @@ $ npm install react-json-view@1.21.3 /** * title: Default usage * desc: Update state or props, you can see the output in the console - * - * title.zh-CN: 基础用法 - * desc.zh-CN: 更新 state 或 props，可以在控制台看到输出 */ import { useWhyDidYouUpdate } from 'ahooks'; @@ -120,100 +117,103 @@ This document is verified based on the following versions： > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -以下Properties已验证，详情见 [ahooks官方文档](https://ahooks.js.org/zh-CN/) - -| Name | Description | Type | Platform | HarmonyOS Support | -| :------------------------: | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :------: | :------: | :---------------: | -| 快速上手 | `useRequest` 的第一个参数是一个异步函数，在组件初次加载时，会自动触发该函数执行 | Function | All | yes | -| 基础用法 | 同时自动管理该异步函数的 `loading` , `data` , `error` 等状态 | Function | All | yes | -| Loading Delay | 通过设置 `options.loadingDelay` ，可以延迟 `loading` 变成 `true` 的时间，有效防止闪烁 | Function | All | yes | -| 轮询 | 通过设置 `options.pollingInterval`，进入轮询模式，`useRequest` 会定时触发 service 执行 | Function | All | yes | -| Ready | 通过设置 `options.ready`，可以控制请求是否发出，当其值为 `false` 时，请求永远都不会发出 | Function | All | yes | -| 依赖刷新 | 通过设置 `options.refreshDeps`，在依赖变化时， `useRequest` 会自动调用 [refresh](https://ahooks.js.org/zh-CN/hooks/use-request/basic/#result) 方法，实现[刷新（重复上一次请求）](https://ahooks.js.org/zh-CN/hooks/use-request/basic/#刷新重复上一次请求) | Function | All | yes | -| 屏幕聚焦重新请求 | 通过设置 `options.refreshOnWindowFocus`，在浏览器窗口 `refocus` 和 `revisible` 时，会重新发起请求 | Function | All | yes | -| 防抖 | 通过设置 `options.debounceWait`，进入防抖模式，此时如果频繁触发 `run` 或者 `runAsync`，则会以防抖策略进行请求 | Function | All | yes | -| 节流 | 通过设置 `options.throttleWait`，进入节流模式，此时如果频繁触发 `run` 或者 `runAsync`，则会以节流策略进行请求 | Function | All | yes | -| 缓存 & SWR | 通过 `options.staleTime` 设置数据保持新鲜时间，在该时间内，我们认为数据是新鲜的，不会重新发起请求 | Function | All | yes | -| 错误重试 | 通过设置 `options.retryCount`，指定错误重试次数，则 useRequest 在失败后会进行重试 | Function | All | yes | -| useHistoryTravel | 管理状态历史变化记录，方便在历史记录中前进与后退 | Function | All | yes | -| useCountDown | 一个用于管理倒计时的 Hook | Function | All | yes | -| useCounter | 管理计数器的 Hook | Function | All | yes | -| useWebSocket | 用于处理 WebSocket 的 Hook | Function | All | yes | -| useMount | 只在组件初始化时执行的 Hook | Function | All | yes | -| useUnmount | 在组件卸载（unmount）时执行的 Hook | Function | All | yes | -| useUnmountedRef | 获取当前组件是否已经卸载的 Hook | Function | All | yes | -| useSetState | 管理 object 类型 state 的 Hooks，用法与 class 组件的 `this.setState` 基本一致 | Function | All | yes | -| useBoolean | 优雅的管理 boolean 状态的 Hook | Function | All | yes | -| useToggle | 用于在两个状态值间切换的 Hook | Function | All | yes | -| useCookieState | 一个可以将状态存储在 Cookie 中的 Hook | Function | All | yes | -| useSessionStorageState | 将状态存储在 sessionStorage 中的 Hook | Function | All | yes | -| useDebounce | 用来处理防抖值的 Hook | Function | All | yes | -| useThrottle | 用来处理节流值的 Hook | Function | All | yes | -| useMap | 管理 Map 类型状态的 Hook | Function | All | yes | -| useSet | 管理 Set 类型状态的 Hook | Function | All | yes | -| usePrevious | 保存上一次状态的 Hook | Function | All | yes | -| useRafState | 只在 [requestAnimationFrame](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame) callback 时更新 state，一般用于性能优化 | Function | All | yes | -| useSafeState | 用法与 `React.useState` 完全一样，但是在组件卸载后异步回调内的 `setState` 不再执行，避免因组件卸载后更新状态而导致的内存泄漏 | Function | All | yes | -| useGetState | 给 `React.useState` 增加了一个 getter 方法，以获取当前最新值 | Function | All | yes | -| useResetState | 提供重置 state 方法的 Hooks，用法与 `React.useState` 基本一致 | Function | All | yes | -| useUpdateEffect | `useUpdateEffect` 用法等同于 `useEffect`，但是会忽略首次行，只在依赖更新时执行 | Function | All | yes | -| useUpdateLayoutEffect | `useUpdateLayoutEffect` 用法等同于 `useLayoutEffect`，但是会忽略首次执行，只在依赖更新时执行 | Function | All | yes | -| useAsyncEffect | useEffect 支持异步函数 | Function | All | yes | -| useDebounceEffect | 为 `useEffect` 增加防抖的能力 | Function | All | yes | -| useDebounceFn | 用来处理防抖函数的 Hook | Function | All | yes | -| useThrottleFn | 用来处理函数节流的 Hook | Function | All | yes | -| useThrottleEffect | 为 `useEffect` 增加节流的能力 | Function | All | yes | -| useDeepCompareEffect | 用法与 useEffect 一致，但 deps 通过 [lodash isEqual](https://lodash.com/docs/4.17.15#isEqual) 进行深比较 | Function | All | yes | -| useDeepCompareLayoutEffect | 用法与 useLayoutEffect 一致，但 deps 通过 [lodash isEqual](https://lodash.com/docs/4.17.15#isEqual) 进行深比较 | Function | All | yes | -| useInterval | 一个可以处理 setInterval 的 Hook | Function | All | yes | -| useRafInterval | 用 `requestAnimationFrame` 模拟实现 `setInterval`，API 和 `useInterval` 保持一致，好处是可以在页面不渲染的时候停止执行定时器，比如页面隐藏或最小化等 | Function | All | yes | -| useTimeout | 一个可以处理 setTimeout 计时器函数的 Hook | Function | All | yes | -| useRafTimeout | 用 `requestAnimationFrame` 模拟实现 `setTimeout`，API 和 `useTimeout` 保持一致，好处是可以在页面不渲染的时候不触发函数执行，比如页面隐藏或最小化等 | Function | All | yes | -| useLockFn | 用于给一个异步函数增加竞态锁，防止并发执行 | Function | All | yes | -| useUpdate | useUpdate 会返回一个函数，调用该函数会强制组件重新渲染 | Function | All | yes | -| useControllableValuet | 在某些组件开发时，我们需要组件的状态既可以自己管理，也可以被外部控制，`useControllableValue` 就是帮你管理这种状态的 Hook | Function | All | yes | -| useCreation | `useCreation` 是 `useMemo` 或 `useRef` 的替代品，因为 `useMemo` 不能保证被 memo 的值一定不会被重新计算，而 `useCreation` 可以保证这一点 | Function | All | yes | -| useEventEmitter | 在组件中调用 `useEventEmitter` 可以获得一个 `EventEmitter` | Function | All | yes | -| useLatest | 返回当前最新值的 Hook，可以避免闭包问题 | Function | All | yes | -| useMemoizedFn | 持久化 function 的 Hook，一般情况下，可以使用 useMemoizedFn 完全代替 useCallback，特殊情况见 [FAQ](https://ahooks.js.org/zh-CN/hooks/use-memoized-fn#faq) | Function | All | yes | -| useReactive | 提供一种数据响应式的操作体验，定义数据状态不需要写`useState`，直接修改Properties即可刷新视图 | Function | All | yes | -| useTrackedEffect | 追踪是哪个依赖变化触发了 `useEffect` 的执行 | Function | All | yes | -| useWhyDidYouUpdate | 帮助开发者排查是哪个Properties改变导致了组件的 rerender | Function | All | yes | - -## 手机端不支持方法澄清 - -| title | hook-name | 解释 | 问题描述 | HarmonyOS Support | -| -------- | --------------------- | ------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- | :---------------: | -| Dom | useDrop & useDrag | 处理元素拖拽的 Hook | Property 'document' doesn't exist Properties“document”不存在 | NO | -| Dom | useEventListener | 优雅的使用 addEventListener | 基础用法：无报错 监听 keydown 事件：无物理键盘 | NO | -| Dom | useClickAway | 监听目标元素外的点击事件 | Property 'document' doesn't exist Properties“document”不存在 | NO | -| Dom | useDocumentVisibility | 监听页面是否可见 | 无报错，无法监听到state状态变化，获取不到手机窗口 | NO | -| Dom | useEventTarget | 常见表单控件(通过 e.target.value 获取表单值) 的 onChange 跟 value 逻辑封装，支持自定义值转换和重置功能 | Cannot read property ‘value’of undefined | NO | -| Dom | useExternal | 动态注入 JS 或 CSS 资源，useExternal 可以保证资源全局唯一 | Property 'document' doesn't exist Properties“document”不存在 | NO | -| Dom | useTitle | 用于设置页面标题 | Property 'document' doesn't exist Properties“document”不存在 | NO | -| Dom | useFavicon | 设置页面的 favicon | Property 'document' doesn't exist Properties“document”不存在 | NO | -| Dom | useFullscreen | 管理 DOM 全屏的 Hook | Property 'document' doesn't exist Properties“document”不存在 | NO | -| Dom | useHover | 监听 DOM 元素是否有鼠标悬停 | 无报错，点击按钮无反应，监听不到Properties变化 | NO | -| Dom | useInViewport | 观察元素是否在可见区域，以及元素可见比例 | Property 'document' doesn't exist Properties“document”不存在 | NO | -| Dom | useKeyPress | 监听键盘按键，支持组合键，支持按键别名 | 无报错，没有物理键盘，无法操作Properties | NO | -| Dom | useLongPress | 监听目标元素的长按事件 | Property 'document' doesn't exist Properties“document”不存在 | NO | -| Dom | useMouse | 监听鼠标位置 | 无报错，点击按钮无反应，监听不到Properties变化 | NO | -| Dom | useResponsive | 获取响应式信息 | Cannot convert undefined value to object | NO | -| Dom | useScroll | 监听元素的滚动位置 | Property 'document' doesn't exist Properties“document”不存在 | NO | -| Dom | useSize | 监听 DOM 节点尺寸变化的 Hook | 无报错，无法获取到document | NO | -| Dom | useFocusWithin | 监听当前焦点是否在某个区域之内 | 无报错，无法监听到state变化 | NO | -| Advanced | useReactive | 提供一种数据响应式的操作体验，定义数据状态不需要写useState，直接修改Properties即可刷新视图 | input输入框中无法输入文字，只能输入数字 Cannot read property 'map' of undefined | NO | -| State | useUrlState | 通过 url query 来管理 state 的 Hook | 无报错，不生效 | NO | -| State | useLocalStorageState | 将状态存储在 localStorage 中的 Hook | 无报错，不生效 | NO | -| Scene | useAntdTable | useAntdTable 会自动管理 Table 分页数据，你只需要把返回的 tableProps 传递给 Table 组件 | ui组件无法使用，document”不存在 | NO | -| Scene | useFusionTable | useFusionTable 会自动管理 Table 分页数据，你只需要把返回的 tableProps 与 paginationProps 传递给相应组件 | ui组件无法使用，document”不存在 | NO | -| Scene | useInfiniteScroll | useInfiniteScroll 封装了常见的无限滚动逻辑 | 滚动自动加载:在无限滚动场景中数据加载变多Scroll无响应 | NO | -| Scene | usePagination | 用法与 useRequest 一致，但会多返回一个 pagination 参数，包含所有分页信息，及操作分页的函数 | 报错，不支持mockjs | NO | -| Scene | useDynamicList | 一个帮助你管理动态列表状态，并能生成唯一 key 的 Hook | 报错，Render ErrorView config getter callback for component path mustbe a function (recelved undefined). Make sure to startcomponent names with a capital letter. | NO | -| Scene | useVirtualList | 提供虚拟化列表能力的 Hook，用于解决展示海量数据渲染时首屏渲染缓慢和滚动卡顿问题 | 无报错，不生效 | NO | -| Scene | useNetwork | 管理网络连接状态的 Hook | 报错,window.addEventListener is not a function | NO | -| Scene | useSelections | 常见联动 Checkbox 逻辑封装，支持多选，单选，全选逻辑，还提供了是否选择，是否全选，是否半选的状态 | Property 'document' doesn't exist Properties“document”不存在 | NO | -| Scene | useTextSelection | 实时获取用户当前鼠标选取的文本内容及位置 | 无报错，没有鼠标，无法操作Properties | NO | +The following properties have been verified. For details, see [ahooks](https://ahooks.js.org/). + +| Name | Description | Type | Platform | HarmonyOS Support | +| :------------------------: | :----------------------------------------------------------: | :------: | :------: | :---------------: | +| Quick Start | The first parameter of **useRequest** is an asynchronous function, which will be automatically triggered when the component is first loaded. | Function | All | yes | +| Basic usage | Manages the status of **loading**, **data**, **error** of the asynchronous function. | Function | All | yes | +| Loading Delay | Delays the time when **loading** turns to **true** by setting **options.loadingDelay**, effectively preventing UI flashing. | Function | All | yes | +| Polling | Enters the polling mode by setting **options.pollingInterval**. **useRequest** periodically triggers service execution. | Function | All | yes | +| Ready | Controls whether to send a request by setting **options.ready**. If **options.ready** is set to **false**, the request will never be sent. | Function | All | yes | +| RefreshDeps | By setting **options.refreshDeps**, **useRequest** automatically invokes [refresh](https://ahooks.js.org/hooks/use-request/basic/#result) when dependencies change, achieving the effect of [refresh](https://ahooks.js.org/hooks/use-request/basic/#refresh-repeat-the-last-request). | Function | All | yes | +| RefreshOnWindowFocus | Refreshes a request by setting **options.refreshOnWindowFocus** when the browser is **refocus** and **revisible**. | Function | All | yes | +| Debounce | Enters the debounce mode by setting **options.debounceWait**. At this time, if **run** or **runAsync** is triggered frequently, the request will be executed with the debounce strategy. | Function | All | yes | +| Throttle | Enters the throttle mode by setting **options.throttleWait**. At this time, if **run** or **runAsync** is triggered frequently, the request will be executed with the throttle strategy. | Function | All | yes | +| Cache & SWR | Sets the data retention time through **options.staleTime**. During this time, the data is considered to be fresh and the request will not be re-initiated. | Function | All | yes | +| Error Retry | Specifies the number of retry times by setting `options.retryCount`.** useRequest** will retry after a failure. | Function | All | yes | +| useHistoryTravel | Manages state change history to facilitate forward and backward operations in historical records. | Function | All | yes | +| useCountDown | Manages countdown. | Function | All | yes | +| useCounter | Manages counter. | Function | All | yes | +| useWebSocket | Handles WebSocket. | Function | All | yes | +| useMount | Executes a function only when the component is mounted. | Function | All | yes | +| useUnmount | Executes a function when the component is unmounted. | Function | All | yes | +| useUnmountedRef | Obtains whether the component is unmounted. | Function | All | yes | +| useSetState | Manages the state of object type, which is similar to the usage of **this.setState** of the **class** component. | Function | All | yes | +| useBoolean | Manages the boolean state elegantly. | Function | All | yes | +| useToggle | Toggles states. | Function | All | yes | +| useCookieState | Stores the state in Cookie. | Function | All | yes | +| useSessionStorageState | Stores the state in sessionStorage. | Function | All | yes | +| useDebounce | Deals with the debounced value. | Function | All | yes | +| useThrottle | Deals with the value of **Throttle**. | Function | All | yes | +| useMap | Manages the state of **Map**. | Function | All | yes | +| useSet | Manages the state of **Set**. | Function | All | yes | +| usePrevious | Saves the previous state. | Function | All | yes | +| useRafState | Updates the state in [requestAnimationFrame](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame), generally used for performance optimization. | Function | All | yes | +| useSafeState | Works in the same way as **React.useState**. However, after the component is unmounted, **setState** in the asynchronous callback is not executed to avoid memory leakage caused by state update. | Function | All | yes | +| useGetState | Adds a **getter** method to the return value of **React.useState** to get the latest value. | Function | All | yes | +| useResetState | Provides a method to reset the state. This hook works similar to **React.useState**. | Function | All | yes | +| useUpdateEffect | Runs the effect when dependencies are updated, but skips running the effect for the first time. This hook works in the same way as **useEffect**. | Function | All | yes | +| useUpdateLayoutEffect | Runs the effect when dependencies are updated, but skips running the effect for the first time. This hook works in the same way as **useLayoutEffect**. | Function | All | yes | +| useAsyncEffect | Runs the effect using asynchronous functions. | Function | All | yes | +| useDebounceEffect | Debounces **useEffect**. | Function | All | yes | +| useDebounceFn | Deals with the debounce functions. | Function | All | yes | +| useThrottleFn | Deals with the throttle functions. | Function | All | yes | +| useThrottleEffect | Throttles **useEffect**. | Function | All | yes | +| useDeepCompareEffect | Works in the same way as **useEffect**, but **deps** is compared with [lodash isEqual](https://lodash.com/docs/4.17.15#isEqual). | Function | All | yes | +| useDeepCompareLayoutEffect | Works in the same way as **useLayoutEffect**, but **deps** is compared with [lodash isEqual](https://lodash.com/docs/4.17.15#isEqual). | Function | All | yes | +| useInterval | Handles the **setInterval** timer function. | Function | All | yes | +| useRafInterval | Implements **setInterval** with **requestAnimationFrame**. This hook works in the same way as **useInterval**. The advantage is that the timer can be stopped when the page is not rendered, for example, the page is hidden or minimized. | Function | All | yes | +| useTimeout | Handles the **setTimeout** timer function. | Function | All | yes | +| useRafTimeout | Implements **setTimeout** with **requestAnimationFrame**. The API is consistent with **useTimeout**. The advantage is that function execution is not triggered when the page is not rendered, for example, the page is hidden or minimized. | Function | All | yes | +| useLockFn | Adds a lock to an asynchronous function to prevent parallel executions. | Function | All | yes | +| useUpdate | Returns a function which can be used to force the component to re-render. | Function | All | yes | +| useControllableValuet | Manages the states of some components whose states can be managed by themselves or controlled by their parents. | Function | All | yes | +| useCreation | Substitutes for **useMemo** or **useRef** because **useMemo** cannot ensure that the memoized value will not be recalculated, while **useCreation** can ensure that. | Function | All | yes | +| useEventEmitter | Obtains an instance of **EventEmitter** in components. | Function | All | yes | +| useLatest | Returns the latest value to avoid closure problems. | Function | All | yes | +| useMemoizedFn | Handles persistent functions. In general, **useMemoizedFn** can substitute for **useCallback**. For special cases, see [FAQ](https://ahooks.js.org/hooks/use-memoized-fn/#faq). | Function | All | yes | +| useReactive | Provides data reactivity during operations, in which case **useState** is unnecessary for state definition. Modifying properties will automatically lead to view rerendering. | Function | All | yes | +| useTrackedEffect | Tracks which dependency change triggers the execution of **useEffect**. | Function | All | yes | +| useWhyDidYouUpdate | Locates the properties that caused component rerender. | Function | All | yes | + +## Clarification of the Method Not Supported on the Mobile Phone + +| title | hook-name | Description | Issue Description | HarmonyOS Support | +| -------- | --------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | :---------------: | +| Dom | useDrop & useDrag | Manages data transfer between drag and drop. | The message "Property 'document' doesn't exist" is displayed. | NO | +| Dom | useEventListener | Uses **addEventListener** elegantly. | No error is reported, but no physical keyboard is available when the keydown event is listened. | NO | +| Dom | useEventListener | Uses **addEventListener** elegantly. | An error is reported, and no physical keyboard is available. | NO | +| Dom | useClickAway | Listens for click events outside the target element. | The message "Property 'document' doesn't exist" is displayed. | NO | +| Dom | useDocumentVisibility | Listens for whether the page is visible. | No error is reported, but the state change cannot be monitored and the mobile phone window cannot be obtained. | NO | +| Dom | useEventTarget | Encapsulates **onChange** and **value** logic for form components whose values are obtained through **e.target.value**, and supports custom transformation and reset functionalities. | The error message "Cannot read property 'value' of undefined" is displayed. | NO | +| Dom | useExternal | Injects JS or CSS resources dynamically. useExternal can ensure that the resources are globally unique. | The message "Property 'document' doesn't exist" is displayed. | NO | +| Dom | useTitle | Sets the page title. | The message "Property 'document' doesn't exist" is displayed. | NO | +| Dom | useFavicon | Sets the favicon of the page. | The message "Property 'document' doesn't exist" is displayed. | NO | +| Dom | useFullscreen | Manages DOM full screen. | The message "Property 'document' doesn't exist" is displayed. | NO | +| Dom | useHover | Listens for whether the element is being hovered. | No error is reported, but the system does not respond after the button is clicked and the property change cannot be monitored. | NO | +| Dom | useInViewport | Checks whether the element is in the visible area and the visible area ratio of the element. | The message "Property 'document' doesn't exist" is displayed. | NO | +| Dom | useKeyPress | Listens for the keyboard press. Composite keys and aliases are supported. | No error is reported, but no physical keyboard is available and properties cannot be operated. | NO | +| Dom | useLongPress | Listens for the long press event of the target element. | The message "Property 'document' doesn't exist" is displayed. | NO | +| Dom | useMouse | Listens for the mouse position. | No error is reported, but the system does not respond after the button is clicked and the property change cannot be monitored. | NO | +| Dom | useResponsive | Obtains responsive information. | Cannot convert undefined value to object | NO | +| Dom | useScroll | Listens for the scrolling position of an element. | The message "Property 'document' doesn't exist" is displayed. | NO | +| Dom | useSize | Listens for the size change of the DOM node. | No error is reported, but the document cannot be obtained. | NO | +| Dom | useFocusWithin | Listens for whether the current focus is within a certain area. | No error is reported, but the state change cannot be monitored. | NO | +| Advanced | useReactive | Provides data reactivity during operations, in which case **useState** is unnecessary for state definition. Modifying properties will automatically lead to view rerendering. | Only digits can be entered in the input text box, and the message "Cannot read property 'map' of undefined" is displayed. | NO | +| State | useUrlState | Manages the state through **url query**. | No error is reported and the hook does not take effect. | NO | +| State | useLocalStorageState | Stores the state in **localStorage**. | No error is reported and the hook does not take effect. | NO | +| Scene | useAntdTable | Manages pagination data of **Table**. You only need to pass the returned **tableProps** to the **Table** component. | The UI component cannot be used and document does not exist. | NO | +| Scene | useFusionTable | Manages the pagination data of **Table**. You only need to pass the returned **tableProps** and **paginationProps** to the corresponding components. | The UI component cannot be used and document does not exist. | NO | +| Scene | useInfiniteScroll | Encapsulates the common infinite scroll logic. | In the infinite scrolling scenario, the number of data increases and the scroll does not respond. | NO | +| Scene | usePagination | Works in the same way as **useRequest**, but returns an additional **pagination** parameter, which contains all pagination information and functions for pagination operations. | An error is reported that **mockjs** is not supported. | NO | +| Scene | useDynamicList | Manages dynamic list and generates unique key for each item. | An error is reported and the message "Render ErrorView config getter callback for component path must be a function (received undefined)" is displayed. Make sure to start component names with a capital letter. | NO | +| Scene | useVirtualList | Allows you to use virtual list to render huge chunks of list data. | No error is reported and the hook does not take effect. | NO | +| Scene | useNetwork | Manages the state of network connection. | An error is reported and the message "window.addEventListener is not a function" is displayed. | NO | +| Scene | useSelections | Encapsulates the logic of common Checkbox group. Multiple selection, single selection, select-all, select-none and semi-selected are supported. | The message "Property 'document' doesn't exist" is displayed. | NO | +| Scene | useTextSelection | Obtains the text content and position selected by the user in real time. | No error is reported, but no mouse is available, and the properties cannot be operated. | NO | + +## ## Others diff --git a/en/js/redux-toolkit.md b/en/js/redux-toolkit.md index 4962e66e..d0ae4388 100644 --- a/en/js/redux-toolkit.md +++ b/en/js/redux-toolkit.md @@ -16,9 +16,9 @@ ## Installation and Usage -> [!TIP] This library depends on react-redux，Can be referred to[react-redux documentation](react-redux.md)install +> [!TIP] This library depends on the react-redux library. For details about how to install this library, see [react-redux documentation](./react-redux.md). -Go to the project directory and execute the following instruction: +Find the matching version information in the release address of a third-party library and download an applicable .tgz package: [redux-toolkit Releases](redux-toolkit Releases](https://github.com/reduxjs/redux-toolkit/releases). @@ -38,7 +38,7 @@ yarn add @reduxjs/toolkit@2.2.1 The following code shows the basic use scenario of the repository: -1.Introduce the provider component into the index.js entry file and add the sotre attribute +1. Introduce the **provider** component into the **index.js entry** file and add the **store** property. ```js // index.js @@ -57,7 +57,7 @@ ReactDOM.render( ); ``` -2.Create a created Slice slice and export the reducer attribute: +2. Create a slice and export the **reducer** property. ```js // features/counter/counterSlice.js @@ -93,7 +93,7 @@ export const { increment, decrement, incrementByAmount } = counterSlice.actions export default counterSlice.reducer ``` -3.Create store.js and use configurationStore to import the reducer exported above +3. Create **store.js** and use **configurationStore** to import **reducer** exported above. ```js // app/store.js @@ -111,7 +111,7 @@ export type RootState = ReturnType export type AppDispatch = typeof store.dispatch ``` -4.Write a conter component to implement simple counting increases and decreases +4. Write a **counter** component to implement simple counting increases and decreases. ```js // features/counter/Counter.js @@ -152,9 +152,9 @@ export function Counter() { This document is verified based on the following versions: -1. RNOH：0.72.20; SDK：HarmonyOS NEXT Developer Preview2; IDE：DevEco Studio 5.0.3.200; ROM：205.0.0.18; +1. RNOH: 0.72.20; SDK: HarmonyOS NEXT Developer Preview2; IDE: DevEco Studio 5.0.3.200; ROM: 205.0.0.18; -## Properties And Methods +## Properties and Methods > [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library. @@ -162,59 +162,60 @@ This document is verified based on the following versions: > > See details [redux-toolkit Source library address](https://github.com/reduxjs/redux-toolkit) -| Name | Description | Type | Required | Platform | HarmonyOS Support | -| ------------------------ | ------------------------------------------------- | -------- | -------- | -------- | ----------------- | -| configureStore | 创建store的方法 | Function | yes | All | yes | -| reducer | configureStore参数，reducer对象 | Object | yes | All | yes | -| middleware | configureStore参数，存放中间件的数组 | Array | yes | All | yes | -| devTools | configureStore参数，浏览器调试用具 | Boolean | yes | Web | no | -| preloadedState | configureStore参数，默认的state值 | Object | yes | All | yes | -| enhancers | configureStore参数，存放增强功能数组 | Array | yes | All | yes | -| getDefaultMiddleware | 获取默认中间件列表 | Function | yes | All | yes | -| immutableCheck | getDefaultMiddleware对象参数属性 | Boolean | yes | All | yes | -| serializableCheck | getDefaultMiddleware对象参数属性 | Boolean | yes | All | yes | -| actionCreatorCheck | getDefaultMiddleware对象参数属性 | Boolean | yes | All | yes | -| createListenerMiddleware | 创建中间件监听函数 | Function | yes | All | yes | -| middleware | createListenerMiddleware属性，中间件列表 | Array | yes | All | yes | -| startListening | createListenerMiddleware属性，添加一个监听 | Function | yes | All | yes | -| stopListening | createListenerMiddleware属性，暂停一个监听 | Function | yes | All | yes | -| clearListeners | createListenerMiddleware属性，清除所有监听 | Function | yes | All | yes | -| addListener | createListenerMiddleware属性，添加一个监听 | Function | yes | All | yes | -| removeListener | createListenerMiddleware属性，暂停一个监听 | Function | yes | All | yes | -| clearAllListeners | createListenerMiddleware属性，清除所有监听 | Function | yes | All | yes | -| createDynamicMiddleware | 创建一个中间件 | Function | yes | All | yes | -| getDefaultEnhancers | 获取默认增强功能组件 | Function | yes | All | yes | -| createReducer | 创建reducer | Function | yes | All | yes | -| addCase | createReducer函数返回对象参数方法，添加action | Function | yes | All | yes | -| addMatcher | createReducer函数返回对象参数方法，添加过滤条件 | Function | yes | All | yes | -| addDefaultCase | createReducer函数返回对象参数方法，添加默认action | Function | yes | All | yes | -| createAction | 创建action | Function | yes | All | yes | -| createSlice | 创建slice切片 | Function | yes | All | yes | -| name | createSlice属性，store名字 | String | yes | All | yes | -| initialState | createSlice属性，store默认值 | object | yes | All | yes | -| reducers | createSlice属性，reducer对象 | Object | yes | All | yes | -| extraReducers | createSlice属性，额外的reducer对象 | Object | yes | All | yes | -| createAsyncThunk | 创建异步action | Function | yes | All | yes | -| createEntityAdapter | 创建适配器 | Function | yes | All | yes | -| selectId | createEntityAdapter属性，表示唯一ID | String | yes | All | yes | -| sortComparer | createEntityAdapter属性，排序方法 | Function | yes | All | yes | -| getInitialState | createEntityAdapter属性，默认状态 | Object | yes | All | yes | -| combineSlices | 结合两个Slice切片 | Function | yes | All | yes | -| createSelector | 创建select选择器 | Function | yes | All | yes | - -## 工具方法 - -| Name | Description | Type | Required | Platform | HarmonyOS Support | -| ------------------- | ------------------------------ | -------- | -------- | -------- | ----------------- | -| isAllOf | 判断action是否全部通过 | Function | yes | All | yes | -| isAnyOf | 判断action是否有一个通过 | Function | yes | All | yes | -| isAsyncThunkAction | 判断action是否是异步 | Function | yes | All | yes | -| isPending | 判断action是否在执行中 | Function | yes | All | yes | -| isRejected | 判断action是否执行失败 | Function | yes | All | yes | -| isFulfilled | 判断action是否执行完成 | Function | yes | All | yes | -| isRejectedWithValue | 判断action是否执行失败并返回值 | Function | yes | All | yes | -| nanoid | 生成随机字符串 | Function | yes | All | yes | -| miniSerializeError | 打印错误信息 | Function | yes | All | yes | +| Name | Description | Type | Required | Platform | HarmonyOS Support | +| ------------------------ | ------------------------------------------------------------ | -------- | -------- | -------- | ----------------- | +| configureStore | Method used to create **store**. | Function | yes | All | yes | +| reducer | Parameter of **configureStore**. | Object | yes | All | yes | +| middleware | Parameter of **configureStore**, which is used to store the array of middleware. | Array | yes | All | yes | +| devTools | Parameter of **configureStore**, which is used for browser debugging. | Boolean | yes | Web | no | +| preloadedState | Parameter of **configureStore**, which is used to specify the default value of **state**. | Object | yes | All | yes | +| enhancers | Parameter of **configureStore**, which is used to customize the enhancer array. | Array | yes | All | yes | +| getDefaultMiddleware | Method used to obtain the default middleware list. | Function | yes | All | yes | +| immutableCheck | Property of the object parameters in **getDefaultMiddleware**. | Boolean | yes | All | yes | +| serializableCheck | Property of the object parameters in **getDefaultMiddleware**. | Boolean | yes | All | yes | +| actionCreatorCheck | Property of the object parameters in **getDefaultMiddleware**. | Boolean | yes | All | yes | +| createListenerMiddleware | Method used to create a listener for the middleware. | Function | yes | All | yes | +| middleware | Property of **createListenerMiddleware**, which indicates the middleware list. | Array | yes | All | yes | +| startListening | Property of **createListenerMiddleware**, which is used to start a listening. | Function | yes | All | yes | +| stopListening | Property of **createListenerMiddleware**, which is used to stop a listening. | Function | yes | All | yes | +| clearListeners | Property of **createListenerMiddleware**, which is used to clear all listening events. | Function | yes | All | yes | +| addListener | Property of **createListenerMiddleware**, which is used to add a listener. | Function | yes | All | yes | +| removeListener | Property of **createListenerMiddleware**, which is used to remove a listener. | Function | yes | All | yes | +| clearAllListeners | Property of **createListenerMiddleware**, which is used to clear all listeners. | Function | yes | All | yes | +| createDynamicMiddleware | Method used to create a middleware. | Function | yes | All | yes | +| getDefaultEnhancers | Method used to obtain the default enhancers. | Function | yes | All | yes | +| createReducer | Method used to create a reducer. | Function | yes | All | yes | +| addCase | Method for the **createReducer** function to return the object parameters, which is used to add an action. | Function | yes | All | yes | +| addMatcher | Method for the **createReducer** function to return the object parameters, which is used to add a matcher. | Function | yes | All | yes | +| addDefaultCase | Method for the **createReducer** function to return the object parameters, which is used to add a default action. | Function | yes | All | yes | +| createAction | Method used to create an action. | Function | yes | All | yes | +| createSlice | Method used to create a slice. | Function | yes | All | yes | +| name | Property of **createSlice**, which indicates the name of **store**. | String | yes | All | yes | +| initialState | Property of **createSlice**, which indicates the default value of **store**. | object | yes | All | yes | +| reducers | Property of **createSlice**, which is a **reducers** object. | Object | yes | All | yes | +| extraReducers | Property of **createSlice**, which is an additional **reducers** object. | Object | yes | All | yes | +| createAsyncThunk | Method used to create an asynchronous action. | Function | yes | All | yes | +| createEntityAdapter | Method used to create an entity adapter. | Function | yes | All | yes | +| selectId | Property of **createEntityAdapter**, which indicates a unique ID. | String | yes | All | yes | +| sortComparer | Property of **createEntityAdapter**, which indicates the sorting method. | Function | yes | All | yes | +| getInitialState | Property of **createEntityAdapter**, which indicates the default state. | Object | yes | All | yes | +| combineSlices | Method used to combine two slices. | Function | yes | All | yes | +| createSelector | Method used to create a selector. | Function | yes | All | yes | +| | | | | | | + +## Utilities + +| Name | Description | Type | Required | Platform | HarmonyOS Support | +| ------------------- | --------------------------------------------------------- | -------- | -------- | -------- | ----------------- | +| isAllOf | Checks whether all actions are passed. | Function | yes | All | yes | +| isAnyOf | Checks whether an action is passed. | Function | yes | All | yes | +| isAsyncThunkAction | Checks whether an action is asynchronous. | Function | yes | All | yes | +| isPending | Checks whether an action is pending. | Function | yes | All | yes | +| isRejected | Checks whether an action is fulfilled. | Function | yes | All | yes | +| isFulfilled | Checks whether an action is rejected. | Function | yes | All | yes | +| isRejectedWithValue | Checks whether an action is rejected with a return value. | Function | yes | All | yes | +| nanoid | Method used to generate a random string. | Function | yes | All | yes | +| miniSerializeError | Method used to display error information. | Function | yes | All | yes | ## Known Issues @@ -222,4 +223,4 @@ This document is verified based on the following versions: ## License -This project is licensed under [The MIT License (MIT)](https://github.com/reduxjs/redux-toolkit?tab=readme-ov-file), Please enjoy and participate freely in open source. +This project is licensed under [MIT License](https://github.com/reduxjs/redux-toolkit?tab=readme-ov-file). \ No newline at end of file diff --git a/en/js/styled-system.md b/en/js/styled-system.md index 16a1ca1b..9d4a109a 100644 --- a/en/js/styled-system.md +++ b/en/js/styled-system.md @@ -73,105 +73,105 @@ export default App; This document is verified based on the following versions: -1. RNOH：0.72.11; SDK：OpenHarmony(api11) 4.1.0.53; IDE：DevEco Studio 4.1.3.412; ROM：2.0.0.52(SP22C00E52R1P17log); -2. RNOH：0.72.33; SDK：OpenHarmony 5.0.0.71(API Version 12 Release); IDE：DevEco Studio 5.0.3.900; ROM：NEXT.0.0.71; +1. RNOH: 0.72.11; SDK: OpenHarmony (api11) 4.1.0.53; IDE: DevEco Studio 4.1.3.412; ROM: 2.0.0.52 (SP22C00E52R1P17log); +2. RNOH: 0.72.33; SDK: OpenHarmony 5.0.0.71 (API Version 12 Release); IDE: DevEco Studio 5.0.3.900; ROM: NEXT.0.0.71; ## Properties -> [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library. +> [!tip] The **Platform** column indicates the platform where the properties are supported in the original third-party library. -> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. +> [!tip] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. For details, see [styled-system GitHub](https://github.com/styled-system/styled-system) **API space** -| Name | Description | Type | Required | HarmonyOS Support | -| ------------- | ----------- | ---- | -------- | ----------------- | -| margin | 外边距 | prop | no | yes | -| marginTop | 上外边距 | prop | no | yes | -| marginRight | 右外边距 | prop | no | yes | -| marginLeft | 左外边距 | prop | no | yes | -| marginX | X 轴外边距 | prop | no | yes | -| marginY | Y 轴外边距 | prop | no | yes | -| padding | 内边距 | prop | no | yes | -| paddingTop | 上内边距 | prop | no | yes | -| paddingRight | 右内边距 | prop | no | yes | -| paddingLeft | 左内边距 | prop | no | yes | -| paddingBottom | 下内边距 | prop | no | yes | -| paddingX | X 轴内边距 | prop | no | yes | -| paddingY | Y 轴内边距 | prop | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ------------- | -------------- | ---- | -------- | ----------------- | +| margin | Margin | prop | no | yes | +| marginTop | Top margin | prop | no | yes | +| marginRight | Right margin | prop | no | yes | +| marginLeft | Left margin | prop | no | yes | +| marginX | X-axis margin | prop | no | yes | +| marginY | Y-axis margin | prop | no | yes | +| padding | Padding | prop | no | yes | +| paddingTop | Top padding | prop | no | yes | +| paddingRight | Right padding | prop | no | yes | +| paddingLeft | Left padding | prop | no | yes | +| paddingBottom | Bottom padding | prop | no | yes | +| paddingX | X-axis padding | prop | no | yes | +| paddingY | Y-axis padding | prop | no | yes | **API color** -| Name | Description | Type | Required | HarmonyOS Support | -| ----- | ----------- | ---- | -------- | ----------------- | -| color | color | prop | no | yes | -| bg | background color | prop | no | yes | +| Name | Description | Type | Required | HarmonyOS Support | +| ----- | ---------------- | ---- | -------- | ----------------- | +| color | color | prop | no | yes | +| bg | background color | prop | no | yes | **API typography** -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| ------------- | ----------- | ---- | -------- | ----------------- | ----- | -| fontSize | fontSize | prop | no | yes | | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| ------------- | ------------- | ---- | -------- | ----------------- | ----- | +| fontSize | fontSize | prop | no | yes | | | fontWeight | fontWeight | prop | no | yes | | -| lineHeight | lineHeight | prop | no | yes | | -| letterSpacing | letterSpacing | prop | no | yes | | -| textAlign | textAlign | prop | no | yes | | -| fontStyle | fontStyle | prop | no | yes | | +| lineHeight | lineHeight | prop | no | yes | | +| letterSpacing | letterSpacing | prop | no | yes | | +| textAlign | textAlign | prop | no | yes | | +| fontStyle | fontStyle | prop | no | yes | | **API layout** | Name | Description | Type | Required | HarmonyOS Support | Notes | | --------- | ----------- | ---- | -------- | ----------------- | ----- | -| width | width | prop | no | yes | | -| height | height | prop | no | yes | | -| minHeight | minHeight | prop | no | yes | | -| maxHeight | maxHeight | prop | no | yes | | +| width | width | prop | no | yes | | +| height | height | prop | no | yes | | +| minHeight | minHeight | prop | no | yes | | +| maxHeight | maxHeight | prop | no | yes | | | size | size | prop | no | yes | | **API flexbox** -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| -------------- | ---------------- | ---- | -------- | ----------------- | ----- | -| alignItems | 列内轴对齐项 | prop | no | yes | | -| justifyContent | 行内轴对齐内容 | prop | no | yes | | -| flexWrap | 换行 | prop | no | yes | | -| flexDirection | 弹性方向 | prop | no | yes | | -| flex | 弹性布局 | prop | no | yes | | -| flexGrow | 分配剩余空间比例 | prop | no | yes | | -| flexShrink | 弹性收缩 | prop | no | yes | | -| flexBasis | 弹性初始长度 | prop | no | yes | | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| -------------- | --------------- | ---- | -------- | ----------------- | ----- | +| alignItems | Align items | prop | no | yes | | +| justifyContent | Justify content | prop | no | yes | | +| flexWrap | Flex wrap | prop | no | yes | | +| flexDirection | Flex direction | prop | no | yes | | +| flex | Flex layout | prop | no | yes | | +| flexGrow | Flex grow | prop | no | yes | | +| flexShrink | Flex shrink | prop | no | yes | | +| flexBasis | Flex basis | prop | no | yes | | **API border** -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| ----------------------- | ------------ | ---- | -------- | ----------------- | ----- | -| border | 边框 | prop | no | yes | | -| borderWidth | 边框宽度 | prop | no | yes | | -| borderStyle | 边框样式 | prop | no | yes | | -| borderColor | 边框颜色 | prop | no | yes | | -| borderRadius | 边框圆角 | prop | no | yes | | -| borderTopWidth | 上边框宽度 | prop | no | yes | | -| borderTopColor | 上边框颜色 | prop | no | yes | | -| borderTopLeftRadius | 上左边框圆角 | prop | no | yes | | -| borderTopRightRadius | 上右边框圆角 | prop | no | yes | | -| borderRightWidth | 右边框宽度 | prop | no | yes | | -| borderRightColor | 右边框颜色 | prop | no | yes | | -| borderBottomWidth | 下边框宽度 | prop | no | yes | | -| borderBottomColor | 下边框颜色 | prop | no | yes | | -| borderBottomLeftRadius | 左下边框圆角 | prop | no | yes | | -| borderBottomRightRadius | 右下边框圆角 | prop | no | yes | | -| borderLeftWidth | 左边框宽度 | prop | no | yes | | -| borderLeftColor | 左边框颜色 | prop | no | yes | | +| Name | Description | Type | Required | HarmonyOS Support | Notes | +| ----------------------- | --------------------------------- | ---- | -------- | ----------------- | ----- | +| border | Border | prop | no | yes | | +| borderWidth | Border width | prop | no | yes | | +| borderStyle | Border style | prop | no | yes | | +| borderColor | Border color | prop | no | yes | | +| borderRadius | Border radius | prop | no | yes | | +| borderTopWidth | Top border width | prop | no | yes | | +| borderTopColor | Top border color | prop | no | yes | | +| borderTopLeftRadius | Top border radius on the left | prop | no | yes | | +| borderTopRightRadius | Top border radius on the right | prop | no | yes | | +| borderRightWidth | Right border width | prop | no | yes | | +| borderRightColor | Right border color | prop | no | yes | | +| borderBottomWidth | Bottom border width | prop | no | yes | | +| borderBottomColor | Bottom border color | prop | no | yes | | +| borderBottomLeftRadius | Bottom border radius on the left | prop | no | yes | | +| borderBottomRightRadius | Bottom border radius on the right | prop | no | yes | | +| borderLeftWidth | Left border width | prop | no | yes | | +| borderLeftColor | Left border color | prop | no | yes | | **API position** | Name | Description | Type | Required | HarmonyOS Support | | ---- | ----------- | ---- | -------- | ----------------- | -| top | top offset | prop | no | yes | -| left | left offset | prop | no | yes | +| top | top offset | prop | no | yes | +| left | left offset | prop | no | yes | ## Known Issues @@ -179,5 +179,4 @@ For details, see [styled-system GitHub](https://github.com/styled-system/styled- ## License -This project is licensed under [The MIT License (MIT)](https://github.com/styled-system/styled-system/blob/master/LICENSE.md) - +This project is licensed under [The MIT License (MIT)](https://github.com/styled-system/styled-system/blob/master/LICENSE.md) \ No newline at end of file diff --git a/en/react-native-animate-number.md b/en/react-native-animate-number.md index 2aa8a9c9..82121cb8 100644 --- a/en/react-native-animate-number.md +++ b/en/react-native-animate-number.md @@ -51,15 +51,15 @@ const App = () => { const [finish, setFinish] = useState(""); const [progress, setProgress] = useState(""); const onProgress = () => { - setProgress("动画正在更新..."); + setProgress ("Animation is being updated..."); }; const onFinish = () => { - setFinish("动画更新完成"); + setFinish ("Animation update completed"); }; return ( - + {/* Refresh for pressure test */} + {refLoadData&&( - 刷新了{reshUiData}次 + Refreshed {reshUiData} times - 测试onLoad + Test onLoad {onLoadDatea} - {console.log('执行了onLoad'); setOnLoad('执行了onLoad')}} + {console.log('onLoad executed'); setOnLoad('onLoad executed')}} style={styles.fitImageWithSize} source={require('./assets/expo.png')} /> - 测试base64图片 + Test the Base64-encoded image. { /> - 测试PropertiesoriginalWidth，originalHeight（在不加宽度高度的情况下） + Local image set with originalWidth and originalHeight but without width and height of style. { /> - 不加originalWidth，originalHeight和不加宽度高度的情况下 + Local image set without originalWidth, originalHeight, and width and height of style. - 不加originalWidth，originalHeight但是加宽度高度的情况下 + Local image set with width and height of style but without originalWidth and originalHeight. - 不加originalWidth，originalHeight但是加宽度高度的情况下的网络图片 + Network image set with width and height of style but without originalWidth and originalHeight. - 加originalWidth，originalHeight但是不加宽度高度的情况下的网络图片 + Network image set with originalWidth and originalHeight but without width and height of style. { /> - 同时加originalWidth，originalHeight和宽度高度的情况下 + Local image set with originalWidth, originalHeight, and width and height of style. { - indicator(加载器 为true) indicatorColor(加载器颜色) indicatorSize(值：large small number) - 值为：large + indicator (value: true); indicatorColor (value: specified color); indicatorSize (value: large, small, or number) + value: large - indicator(加载器 为true) indicatorColor(加载器颜色) indicatorSize(值：large small number) - small + indicator (value: true); indicatorColor (value: specified color); indicatorSize (value: large, small, or number) + value: small - indicator(加载器 为true) indicatorColor(加载器颜色) indicatorSize(值：large small number) - number:值越大指示器越大 + indicator (value: true); indicatorColor (value: specified color); indicatorSize (value: large, small, or number) + number: A larger value indicates a larger indicator. - indicator(加载器 为false) - number:值越大指示器越大 + indicator (value: false) + number: A larger value indicates a larger indicator. - 验证网络图片 + Verify a network image. - 获取本地图片宽高 + Obtain the width and height of a local image. - 宽度：{imgSizeNum.width},高度：{imgSizeNum.height} - + Width: {imgSizeNum.width}; Height: {imgSizeNum.height} + - 验证网络图片宽高 - 宽度：{imgHttpSize.width},高度：{imgHttpSize.height} + Verify the width and height of a network image. + Width: {imgHttpSize.width}; Height: {imgHttpSize.height} - 验证图片圆角 + Verify rounded corners of the image. - 测试resizeMode(cover contain stretch repeat center)，值为cover + Test resizeMode. The value is cover. - 测试resizeMode(cover contain stretch repeat center)，值为contain + Test resizeMode. The value is contain. - 测试resizeMode(cover contain stretch repeat center)，值为stretch + Test resizeMode. The value is stretch. - 测试resizeMode(cover contain stretch repeat center)，值为repeat + Test resizeMode. The value is repeat. - 测试resizeMode(cover contain stretch repeat center)，值为center + Test resizeMode. The value is center. - 测试onError + Test onError. {onErrorDatea} - {console.log('执行了onError'); setOnError('执行了onError')}} + {console.log('onError executed'); setOnError('onError executed')}} style={styles.fitImageWithSize} source={{uri:'https://ok.gitHub.io123.png'}} /> - 测试onLoadStart + Test onLoadStart. {onLoadStartDatea} - {console.log('执行了onLoadStart');setOnLoadStart('执行了onLoadStart')}} + {console.log('onLoadStart executed'); setOnLoadStart('onLoadStart executed')}} style={{...styles.fitImageWithSize,borderRadius:20}} source={require('./assets/expo.png')} /> - 测试onLayOut + Test onLayOut. {onLayOutData} - {console.log('执行了onLayout');setOnLayout('执行了onLayout')}} + {console.log('onLayout executed');setOnLayout('onLayout executed')}} style={{...styles.fitImageWithSize,borderRadius:20}} source={require('./assets/expo.png')} /> - 测试blurRadius(模糊滤镜，值越大越模糊) + Test blurRadius. A larger value indicates a stronger blur. { {!refLoadData&&( - 加载中。。。。。。 + Loading... )} @@ -286,41 +286,41 @@ export default FitImageDemo; This document is verified based on the following versions -1. RNOH：0.72.20; SDK：HarmonyOS NEXT Developer Preview2; IDE：DevEco Studio 5.0.3.200; ROM：3.0.0.21; -2. RNOH：0.72.33; SDK：OpenHarmony 5.0.0.71(API Version 12 Release); IDE：DevEco Studio 5.0.3.900; ROM：NEXT.0.0.71; +1. RNOH: 0.72.20; SDK: HarmonyOS NEXT Developer Preview2; IDE: DevEco Studio 5.0.3.200; ROM: 3.0.0.21; +2. RNOH: 0.72.33; SDK: OpenHarmony 5.0.0.71 (API Version 12 Release); IDE: DevEco Studio 5.0.3.900; ROM: NEXT.0.0.71; ## Properties > [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | Platform | HarmonyOS Support | Remark | -| ------------------ |-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| ------------- | -------- | ----------------------------- | ----------------- | ------------------------------------------------------------ | -| `style` | 图片宽(width)高(height)，边框等样式 | object | yes | Android IOS | YES | 在不加orginalWidth与orginalHeightProperties时，style里面必须设置宽width，高height才能把图片加载出来 | -| `source` | 图片文件源： 本地图片 source={require('./assets/expo.png')}；
网络图片 source={{uri:"xxx"}} | string | yes | Android IOS | YES | | -| `width` | 图片style中Properties | number | yes | Android IOS | YES | | -| `height` | 图片style中Properties | number | yes | Android IOS | YES | | -| `borderRadius` | 图片样式（圆角） | number | No | Android IOS HarmonyOS都不支持 | NO | 此Properties在HarmonyOS，Android ，IOS均不生效;[issues](https://github.com/huiseoul/react-native-fit-image/issues/111) | -| `indicator` | 加载器值为true/false (默认true) | boolean | No | Android IOS | YES | | -| `indicatorColor` | 加载器颜色 | string | No | Android IOS | YES | | -| `indicatorSize` | 加载器大小 值：`large` `small` number(例: indicatorSize={20} ) | string/number | No | Android IOS | YES | | -| resizeMode | 图片布局 值(cover contain stretch repeat center) `cover`: 在保持图片宽高比的前提下缩放图片，直到宽度和高度都大于等于容器视图的尺寸（如果容器有 padding 内衬的话，则相应减去）。**译注**：这样图片完全覆盖甚至超出容器，容器中不留任何空白。 `contain`: 在保持图片宽高比的前提下缩放图片，直到宽度和高度都小于等于容器视图的尺寸（如果容器有 padding 内衬的话，则相应减去）。**译注**：这样图片完全被包裹在容器中，容器中可能留有空白。 `stretch`: 拉伸图片且不维持宽高比，直到宽高都刚好填满容器。 `repeat`: 重复平铺图片直到填满容器。图片会维持原始尺寸，但是当尺寸超过容器时会在保持宽高比的前提下缩放到能被容器包裹。 `center`: 居中不拉伸。 | string | No | Android IOS | YES | | -| blurRadius | 图片模糊滤镜（值越大越模糊） | number | No | Android IOS | YES | | -| onLoad | 图片加载成功回调 | Function | No | Android IOS | YES | | -| resolveAssetSource | 获取本地图片宽高 用法：const img1 = require('./assets/expo.png') let res = Image.resolveAssetSource(img1) | Function | No | Android IOS | YES | | -| getSize | 获取网络图片尺寸：Image.getSize(uri,(width,height)=>{},(fail)=>{}) | Function | No | Android IOS | YES | | -| onError | 获取图片资源出错 | Function | No | Android IOS HarmonyOS都不支持 | NO | [issues](https://github.com/huiseoul/react-native-fit-image/issues/76)；在原库中作者已经说明Some props are not working | -| onLoadStart | 资源刚加载时候 | Function | NO | Android IOS HarmonyOS都不支持 | NO | [issues](https://github.com/huiseoul/react-native-fit-image/issues/76)；在原库中作者已经说明Some props are not working | -| onLayout | 资源改变尺寸或者加载时 | Function | NO | Android IOS HarmonyOS都不支持 | NO | [issues](https://github.com/huiseoul/react-native-fit-image/issues/76)；在原库中作者已经说明Some props are not working | -| orginalWidth | 图片原始宽度 | number | NO | Android IOS | YES | | -| orginalHeight | 图片原始高度 | number | NO | Android IOS | YES | | +| Name | Description | Type | Required | Platform | HarmonyOS Support | Remark | +| ------------------ | ------------------------------------------------------------ | ------------- | -------- | --------------------------------------------- | ----------------- | ------------------------------------------------------------ | +| `style` | Width, height, and border style of the image. | object | yes | Android and iOS | yes | If **orginalWidth** and **orginalHeight** are not set, the **width** and **height** must be set in **style** so that the image can be loaded. | +| `source` | Image source:
For local image, source={require('./assets/expo.png')}.
For network image, source={{uri:"xxx"}}. | string | yes | Android and iOS | yes | | +| `width` | Property of an image style. | number | yes | Android and iOS | yes | | +| `height` | Property of an image style. | number | yes | Android and iOS | yes | | +| `borderRadius` | Image style (rounded corner). | number | no | Not supported on Android, iOS, and HarmonyOS. | no | This property does not take effect on HarmonyOS, Android, and iOS: [issues](https://github.com/huiseoul/react-native-fit-image/issues/111) | +| `indicator` | Indicator. The value can be **true** (default) or **false**. | boolean | no | Android and iOS | yes | | +| `indicatorColor` | Indicator color. | string | no | Android and iOS | yes | | +| `indicatorSize` | Indicator size. The value can be `large`, `small`, or number (for example, indicatorSize={20}). | string/number | no | Android and iOS | yes | | +| resizeMode | Image layout. The options are as follows:
`cover`: scales the image with the aspect ratio retained until the width and height are greater than or equal to the container size. If the container has padding, the padding is subtracted accordingly. **Note**: In this way, the image completely covers or even exceeds the container, and no space is left in the container.
`contain`: scales the image with the aspect ratio retained until the width and height are less than or equal to the container size. If the container has padding, the padding is subtracted accordingly. **Note**: In this way, the image is completely wrapped in the container, and there may be blank space in the container.
`stretch`: stretches the image without retaining the aspect ratio until the width and height fit the container size.
`repeat`: tiles the image repeatedly until the image covers the whole container. The original size of the image is retained. However, when the image size exceeds the container size, the image is scaled to be wrapped by the container while the aspect ratio is retained.
`center`: places the image at the center of the container without stretching it. | string | no | Android and iOS | yes | | +| blurRadius | Image blur filter. A larger value indicates a stronger blur. | number | no | Android and iOS | yes | | +| onLoad | Callback invoked when the image is successfully loaded. | function | no | Android and iOS | yes | | +| resolveAssetSource | Function used to obtain the width and height of a local image.
Example: const img1 = require('./assets/expo.png')
let res = Image.resolveAssetSource(img1) | function | no | Android and iOS | yes | | +| getSize | Function used to obtain the network image size.
Example: Image.getSize(uri,(width,height)=>{},(fail)=>{}) | function | no | Android and iOS | yes | | +| onError | Callback invoked when the image resource fails to be obtained. | function | no | Not supported on Android, iOS, and HarmonyOS. | no | As described in the original library, some properties are not working: [issues](https://github.com/huiseoul/react-native-fit-image/issues/76). | +| onLoadStart | Callback invoked when resources are just loaded. | function | no | Not supported on Android, iOS, and HarmonyOS. | no | As described in the original library, some properties are not working: [issues](https://github.com/huiseoul/react-native-fit-image/issues/76). | +| onLayout | Callback invoked when the resource size is changed or the resource is loaded. | function | no | Not supported on Android, iOS, and HarmonyOS. | no | As described in the original library, some properties are not working: [issues](https://github.com/huiseoul/react-native-fit-image/issues/76). | +| orginalWidth | Original image width. | number | no | Android and iOS | yes | | +| orginalHeight | Original image height. | number | no | Android and iOS | yes | | ## Known Issues -- [ ] 在react-native-fit-image三方库中`onError`.`onLoadStart`.`onLayout`回调方法，在原库文档（react-native-fit-image）作者已说明并没有适配（Some props are not working），有待开发：[issues](https://github.com/huiseoul/react-native-fit-image/issues/76) -- [ ] `borderRadius`图片圆角Properties，在 HarmonyOS ，ios，安卓均不支持，官方文档互动有提到borderRadius不生效：[issues](https://github.com/huiseoul/react-native-fit-image/issues/111) +- [ ] The `onError`, `onLoadStart`, and `onLayout` callbacks are not supported on Android, iOS, and HarmonyOS: [issues](https://github.com/huiseoul/react-native-fit-image/issues/76). +- [ ] The `borderRadius` property is not supported on HarmonyOS, iOS, and Android: [issues](https://github.com/huiseoul/react-native-fit-image/issues/111). ## Others ## License -This project is licensed under [THE BEER-WARE LICENSE](https://gitee.com/link?target=https%3A%2F%2Fgithub.com%2Fhuiseoul%2Freact-native-fit-image%2Fblob%2Fmaster%2FLICENSE). +This project is licensed under [BEER-WARE License](https://github.com/huiseoul/react-native-fit-image/blob/master/LICENSE). \ No newline at end of file diff --git a/en/react-native-ohos-community-auto-fill.md b/en/react-native-ohos-community-auto-fill.md index af35922c..60f39933 100644 --- a/en/react-native-ohos-community-auto-fill.md +++ b/en/react-native-ohos-community-auto-fill.md @@ -8,37 +8,40 @@

-auto-fill 基于 HarmonyOS [autoFillManager](https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-app-ability-autofillmanager-V5) 模块，提供将表单输入数据保存到历史表单输入中，以供下次自动填充的功能，仅支持 ohos 平台。 +Based on the HarmonyOS [autoFillManager](https://developer.huawei.com/consumer/en/doc/harmonyos-references-V5/js-apis-app-ability-autofillmanager-V5) module, auto-fill provides the feature of saving the form input data to the recent forms for automatic filling. This feature is supported only in OpenHarmony OS. -## 前提条件 +## Prerequisites -1. **申请接入智能填充服务** 。当前智能填充处于 Beta 阶段，您可通过发送邮件的方式进行申请接入。邮件模板可参考 [智能填充概述-申请接入智能填充服务](https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/scenario-fusion-introduction-to-smart-fill-V5#section1167564853816) -2. 设备智能填充开关必须处于打开状态，请前往“设置 > 隐私和安全 > 智能填充”打开。 -3. 设备已连接互联网。 -4. 设备需要登录华为账号。 -5. 业务侧需要给 `TextInput` 组件传入 [`textContentType`](https://reactnative.cn/docs/textinput#textcontenttype) 属性。 +1. Apply for the SmartFill service. Currently, SmartFill is in the beta phase. You can send an email to apply for access. For details about the email template, see [Application Email Template](https://developer.huawei.com/consumer/en/doc/harmonyos-guides-V5/scenario-fusion-introduction-to-smart-fill-V5#section107231967593). +2. Enable SmartFill by choosing **Settings** > **Privacy & security** > **SmartFill**. +3. Connect the device to the Internet. +4. Log in to a HUAWEI ID on the device. +5. Pass the [textContentType](https://reactnative.cn/docs/textinput#textcontenttype) attribute to the **TextInput** component on the service side. -## 安装 +## How to Install -Find the matching version information in the release address of a third-party library：[@react-native-ohos-community/auto-fill Releases](https://github.com/react-native-oh-library/auto-fill/releases).For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. +Find the matching version information in the release address of the third-party library: [@react-native-ohos-community/auto-fill Releases](https://github.com/react-native-oh-library/auto-fill/releases). For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. -进入到工程目录并输入以下命令： +Go to the project directory and execute the following instructions: - **npm** + ```bash npm install @react-native-ohos-community/auto-fill ``` + - **yarn** + ```bash yarn add @react-native-ohos-community/auto-fill ``` -## 使用说明 +## Description -### 基本用法 +### How to Use ```tsx import React, { useState } from 'react'; @@ -87,68 +90,68 @@ const MyFormComponent = () => { export default MyFormComponent; ``` -初次调用 `AutoFill.autoSave` 将弹出“保存至历史表单输入”半模态窗。 +When **AutoFill.autoSave** is called for the first time, the saving sheet that asks the user whether to save the input to recent forms is displayed. -- 点击 “保存信息” 按钮之后，智能填充开关会打开并将表单输入数据保存到历史表单输入中。 -- 点击 “忽略” 按钮后，该设备 24 小时之内不会再次询问。该设备累计忽略 5 次后，半模态中将显示“忽略后不再询问”勾选框，勾选之后点击“忽略”按钮，后续将不再询问。 +- If the user touches the **Save** button, SmartFill is enabled and the input data is saved to the recent forms. +- If the user touches the **Ignore** button, the same device will not ask the user again within 24 hours. After the user touches the **Ignore** button for five times, the user will be prompted to choose whether they don't want to be asked again. -### 常见使用场景 +### When to Use -- 联系人信息填充: 适用于如购票信息、收货信息等联系人数据相关表单 -- 账号密码填充：适用于如登录界面相关表单 -- 页面跳转时表单自动填充 -- 示例代码可查看 [ContactsComponent.tsx](https://github.com/react-native-oh-library/auto-fill/blob/sig/tester/App.tsx) +- Contact information filling: applicable to forms related to contact data such as ticket purchase information and delivery information. +- Account and password filling: applicable to forms related to the login page. +- Automatic form filling during page redirection. +- For details about the sample code, see [ContactsComponent.tsx](https://github.com/react-native-oh-library/auto-fill/blob/sig/tester/App.tsx). -> 具体密码保存与填充规则请参考：[密码自动填充服务](https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/passwordvault-V5) +> For details about the password saving and filling rules, see [Password Autofill Service](https://developer.huawei.com/consumer/en/doc/harmonyos-guides-V5/passwordvault-V5). -### ContentType 对应关系 +### The Mapping of ContentType -React-Native 侧 TextInput 组件接收的 [textContentType](https://reactnative.cn/docs/textinput#textcontenttype) 类型与 HarmonyOS 中 [ContentType](https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-textinput-V5#contenttype12%E6%9E%9A%E4%B8%BE%E8%AF%B4%E6%98%8E) 类型映射关系如下，可供参考。 +The following lists the mapping between [textContentType](https://reactnative.cn/docs/textinput#textcontenttype) received by the **TextInput** component in React Native and [ContentType](https://developer.huawei.com/consumer/en/doc/harmonyos-references-V5/ts-basic-components-textinput-V5#contenttype12) in HarmonyOS. ```js -// key 值为 RN 侧 textContentType 值, -// value 值为 HarmonyOS 侧 ContentType 值 +// The key is the value of textContentType in React Native, +// The value is the value of ContentType in HarmonyOS. { - "addressCity": CITY_ADDRESS, // 市 - "addressState": PROVINCE_ADDRESS, // 省 - "countryName": COUNTRY_ADDRESS, // 国家 - "creditCardNumber": BANK_CARD_NUMBER, // 银行卡号 - "fullStreetAddress": FULL_STREET_ADDRESS, // 详细地址 - "sublocality": DISTRICT_ADDRESS, // 区/县 - "telephoneNumber": PHONE_NUMBER, // 手机号码 - "username": USER_NAME, // 用户名 - "password": PASSWORD, // 密码 - "newPassword": NEW_PASSWORD, // 新密码 - "houseNumber": HOUSE_NUMBER, // 门牌号 - "districtAddress": DISTRICT_ADDRESS, // 区/县 - "cityAddress": CITY_ADDRESS, // 市 - "provinceAddress": PROVINCE_ADDRESS, // 省 - "countryAddress": COUNTRY_ADDRESS, // 国家 - "personFullName": PERSON_FULL_NAME, // 姓名 - "personLastName": PERSON_LAST_NAME, // 姓氏 - "personFirstName": PERSON_FIRST_NAME, // 名字 - "phoneNumber": PHONE_NUMBER, // 手机号码 - "phoneCountryCode": PHONE_COUNTRY_CODE, // 国家代码 - "fullPhoneNumber": FULL_PHONE_NUMBER, // 包含国家代码的手机号码 - "emailAddress": EMAIL_ADDRESS, // 邮箱地址 - "bankCardNumber": BANK_CARD_NUMBER, // 银行卡号 - "idCardNumber": ID_CARD_NUMBER, // 身份证号 - "nickName": NICKNAME, // 昵称 - "name": PERSON_FULL_NAME, // 姓名 - "familyName": PERSON_LAST_NAME, // 姓氏 - "givenName": PERSON_FIRST_NAME, // 名字 - "detailInfoWithoutStreet": DETAIL_INFO_WITHOUT_STREET,// 无街道地址 - "formatAddress": FORMAT_ADDRESS, // 标准地址 + "addressCity": CITY_ADDRESS, // City + "addressState": PROVINCE_ADDRESS, // Province + "countryName": COUNTRY_ADDRESS, // Country + "creditCardNumber": BANK_CARD_NUMBER, // Bank card number + "fullStreetAddress": FULL_STREET_ADDRESS, // Detailed address + "sublocality": DISTRICT_ADDRESS, // District/County + "telephoneNumber": PHONE_NUMBER, // Phone number + "username": USER_NAME, // Username + "password": PASSWORD, // Password + "newPassword": NEW_PASSWORD, // New password + "houseNumber": HOUSE_NUMBER, // House number + "districtAddress": DISTRICT_ADDRESS, // District/County + "cityAddress": CITY_ADDRESS, // City + "provinceAddress": PROVINCE_ADDRESS, // Province + "countryAddress": COUNTRY_ADDRESS, // Country + "personFullName": PERSON_FULL_NAME, // Full name + "personLastName": PERSON_LAST_NAME, // Last name + "personFirstName": PERSON_FIRST_NAME, // First name + "phoneNumber": PHONE_NUMBER, // Phone number + "phoneCountryCode": PHONE_COUNTRY_CODE, // Country code + "fullPhoneNumber": FULL_PHONE_NUMBER, // Full phone number + "emailAddress": EMAIL_ADDRESS, // Email address + "bankCardNumber": BANK_CARD_NUMBER, // Bank card number + "idCardNumber": ID_CARD_NUMBER, // ID card number + "nickName": NICKNAME, // Nickname + "name": PERSON_FULL_NAME, // Full name + "familyName": PERSON_LAST_NAME, // Last name + "givenName": PERSON_FIRST_NAME, // First name + "detailInfoWithoutStreet": DETAIL_INFO_WITHOUT_STREET,// Detailed address without street information + "formatAddress": FORMAT_ADDRESS, // Format address } ``` ### Link -目前 HarmonyOS 暂不支持 AutoLink，所以 Link 步骤需要手动配置。 +Currently, HarmonyOS does not support AutoLink. Therefore, you need to manually configure AutoLink. -首先需要使用 DevEco Studio 打开项目里的 HarmonyOS 工程 `harmony` +Open the **harmony** directory of the HarmonyOS project in DevEco Studio. -#### 1. 在 harmony 工程根目录的 `oh-package.json5` 添加 overrides 字段 +#### 1. 1. Adding the **overrides** Field to the **oh-package.json5** File in the Root Directory of the Project ```json { @@ -158,19 +161,19 @@ React-Native 侧 TextInput 组件接收的 [textContentType](https://reactnative } ``` -#### 2. 引入原生端代码 +#### 2. 2. Introducing Native Code -目前有两种方法： +Currently, two methods are available: -（1）通过 har 包引入（在 IDE 完善相关功能后该方法会被遗弃，目前首选此方法）； +(1) Use the HAR file (this method will be deprecated once DevEco Studio supports the relevant functionality; currently, this is the preferred method). -（2）直接链接源码。 +(2) Directly link to the source code. -方法 一：通过 har 包引入（推荐） +Method 1 (recommended): Use the HAR file. -> [!TIP] har 包位于三方库安装路径的 `harmony` 文件夹下。 +> [!TIP] The HAR file is stored in the **harmony** directory in the installation path of the third-party library. -打开 `entry/oh-package.json5`，添加以下依赖 +Open **entry/oh-package.json5** and add the following dependencies: ```json "dependencies": { @@ -179,22 +182,22 @@ React-Native 侧 TextInput 组件接收的 [textContentType](https://reactnative } ``` -点击右上角的 `sync` 按钮 +Click the **sync** button in the upper right corner. -或者在终端执行： +Alternatively, run the following instruction on the terminal: ```bash cd entry ohpm install ``` -方法 二：直接链接源码 +Method 2: Directly link to the source code. -如需使用直接链接源码，请参考[直接链接源码](https://gitee.com/react-native-oh-library/usage-docs/blob/master/zh-cn/link-source-code.md)说明 +For details, see [Direct Linking of Source Code](https://gitee.com/react-native-oh-library/usage-docs/blob/master/en/link-source-code.md). -#### 3. 配置 CMakeLists 和引入 AutoFillPackage +#### 3. Configuring CMakeLists and Introducing AutoFillPackage -打开 `entry/src/main/cpp/CMakeLists.txt`，添加： +Open **entry/src/main/cpp/CMakeLists.txt** and add the following code: ```diff project(rnapp) @@ -220,7 +223,7 @@ add_library(rnoh_app SHARED # RNOH_END: manual_package_linking_2 ``` -打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： +Open **entry/src/main/cpp/PackageProvider.cpp** and add the following code: ```diff #include "RNOH/PackageProvider.h" @@ -236,9 +239,9 @@ std::vector> PackageProvider::getPackages( } ``` -#### 4. 在 ArkTs 侧引入 AutoFillPackage +#### 4. Introducing AutoFillPackage to ArkTs -打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： +Open **entry/src/main/ets/RNPackagesFactory.ts** and add the following code: ```diff ... @@ -251,25 +254,26 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -## 约束与限制 -### 兼容性 +## Constraints + +### Compatibility -要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 +To use this library, you need to use the correct React Native and RNOH versions. In addition, use the matching DevEco Studio and the ROM on your phone. -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-ohos-community/auto-fill Releases](https://github.com/react-native-oh-library/auto-fill/releases) +Find the matching version information in the release address of the third-party library: [@react-native-ohos-community/auto-fill Releases](https://github.com/react-native-oh-library/auto-fill/releases) -## API 接口说明 +## API Description -auto-fill 仅暴露一个 autoSave 接口，用于保存当前表单信息 +auto-fill exposes only the **autoSave** API, which is used to save the current form information. -| API | 说明 | 入参 | 返回值 | -| :------------------------------- | ---------------- | :----------------------------------------------: | :----: | -| autoSave(onSuccess?, onFailure?) | 保存当前表单信息 | (onSuccess?: () => void, onFailure?: () => void) | void | +| API | Description | Parameter | Return Value | +| :------------------------------- | ----------------------------------- | :----------------------------------------------: | :----------: | +| autoSave(onSuccess?, onFailure?) | Saves the current form information. | (onSuccess?: () => void, onFailure?: () => void) | void | -> autoSave 方法在 native 侧限制 2s 内只能调用一次，多次调用将触发 onFailure 回调，并输出 `autoSave called too frequently, please wait for 2 seconds.` +> The **autoSave** API can be invoked only once within 2 seconds on the native side. If the API is invoked multiple times, the **onFailure** callback is triggered and the message "autoSave called too frequently, please wait for 2 seconds" is displayed. -## 开源协议 +## License -本项目基于 [Apache License 2.0](https://github.com/react-native-oh-library/auto-fill/blob/sig/LICENSE) ，请自由地享受和参与开源。 +This project is licensed under [Apache License 2.0](https://github.com/react-native-oh-library/auto-fill/blob/sig/LICENSE). \ No newline at end of file diff --git a/en/react-native-pull.md b/en/react-native-pull.md index 0624e4af..2cb8d8ba 100644 --- a/en/react-native-pull.md +++ b/en/react-native-pull.md @@ -18,7 +18,7 @@ ## Installation and Usage -Find the matching version information in the release address of a third-party library:[@react-native-oh-tpl/react-native-pull/releases](https://github.com/react-native-oh-library/react-native-pull/releases).For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. +Find the matching version information in the release address of a third-party library: [@react-native-oh-tpl/react-native-pull/releases](https://github.com/react-native-oh-library/react-native-pull/releases). For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. Go to the project directory and execute the following instruction: @@ -88,16 +88,16 @@ const onPullRelease = (resolve) => { }, 3000); }; const onPushing = (gesturePosition) => { - testObj.pushing= 'x:' + gesturePosition.x + '------' + 'y：' + gesturePosition.y + testObj.pushing = 'x:' + gesturePosition.x + '------' + 'y: ' + gesturePosition.y setData(testObj) }; const topIndicatorRender = (pulling, pullok, pullrelease) => { if (pulling) { - setCount('下拉刷新pulling...') + setCount('Pull-to-refresh: pulling...') } else if (pullok) { - setCount('松开刷新pullok......') + setCount('Release-to-refresh: pullok...') } else if (pullrelease) { - setCount('玩命刷新中pullrelease......') + setCount('Refreshing: pullrelease...') } return ( @@ -297,17 +297,17 @@ const PullListDemo = () => { const onPushing = (gesturePosition) => { - testObj.pushing= 'x:' + gesturePosition.x + '------' + 'y：' + gesturePosition.y + testObj.pushing = 'x:' + gesturePosition.x + '------' + 'y: ' + gesturePosition.y setData(testObj) }; const topIndicatorRender = (pulling, pullok, pullrelease) => { if (pulling) { - setCount('当前PullList状态: pulling...') + setCount('Current PullList state: pulling...') } else if (pullok) { - setCount('当前PullList状态: pullok......') + setCount('Current PullList state: pullok...') } else if (pullrelease) { - setCount('当前PullList状态: pullrelease......') + setCount('Current PullList state: pullrelease...') } return ( @@ -447,18 +447,18 @@ Check the release version information in the release address of the third-party **`PullView` & `PullList` Pull down effect attribute** -| Name | Description | Type | Required | Platform | HarmonyOS Support | -| -------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -------- | ----------- | ----------------- | -| `style` | 设置组件样式，比如可以设置width/height/backgroudColor等 | Style | no | android,ios | yes | -| `onPulling` | 处于`pulling`状态时执行的方法 | function | no | android,ios | yes | -| `onPullOk` | 处于`pullok`状态时执行的方法 | function | no | android,ios | yes | -| `onPullRelease` | 处于`pullrelease`状态时执行的方法，接受一个参数：`resolve`，最后执行完操作后应该调用`resolve()`。 | function | no | android,ios | yes | -| `onPushing` | 当从下往上推时执行的方法，接受一个参数：`gesturePosition`。gesturePosition是json格式{x, y}对象，当从上往下拉时gesturePosition.y > 0，当从下往上推时gesturePosition.y < 0。 | function | no | android,ios | yes | -| `topIndicatorRender` | 顶部刷新指示组件的渲染方法, 接受4个参数: `ispulling`, `ispullok`, `ispullrelease`，`gesturePosition`，你可以使用`gesturePosition`定义动画头部。 | function | no | android,ios | yes | -| `topIndicatorHeight` | 顶部刷新指示组件的高度, 若定义了topIndicatorRender则同时需要此属性 | number | no | android,ios | yes | -| `isPullEnd` | 是否已经下拉结束，若为true则隐藏顶部刷新指示组件，非必须 | boolean | no | android,ios | yes | -| `onRefresh` | 开始刷新时调用的方法 | function | no | android,ios | yes | -| `refreshing` | 指示是否正在刷新 | function | no | android,ios | yes | +| Name | Description | Type | Required | Platform | HarmonyOS Support | +| -------------------- | ------------------------------------------------------------ | -------- | -------- | ----------- | ----------------- | +| `style` | Sets the component style, such as width, height, and background color. | Style | no | android,ios | yes | +| `onPulling` | Called when the component is in the **pulling** state. | function | no | android,ios | yes | +| `onPullOk` | Called when the component is in the **pullok** state. | function | no | android,ios | yes | +| `onPullRelease` | Called when the component is in the **pullrelease** state. This function contains the **resolve **parameter. You should call **resolve()** at the end. | function | no | android,ios | yes | +| `onPushing` | Called when the component is in the **pushing** state. This function contains the **gesturePosition** parameter, which is a **{x, y}** object in JSON format. When the component is pulled from top to bottom, the value of **gesturePosition.y** is greater than 0. When the object is pushed from bottom to top, the value of **gesturePosition.y** is less than 0. | function | no | android,ios | yes | +| `topIndicatorRender` | Renders the top indicator component. This function contains four parameters: **ispulling**, **ispullok**, **ispullrelease** and **gesturePosition**. You can use **gesturePosition** to define the animation header. | function | no | android,ios | yes | +| `topIndicatorHeight` | Specifies the height of the top indicator component. This property is necessary when **topIndicatorRender** is defined. | number | no | android,ios | yes | +| `isPullEnd` | Indicates whether the pull-down ends. If the value is **true**, the top indicator component is hidden. This parameter is optional. | boolean | no | android,ios | yes | +| `onRefresh` | Called when the refresh starts. | function | no | android,ios | yes | +| `refreshing` | Indicates whether the component is being refreshed. | function | no | android,ios | yes | ## Known Issues @@ -466,4 +466,4 @@ Check the release version information in the release address of the third-party ## License -This project is licensed under [The MIT License (MIT)](https://github.com/greatbsky/react-native-pull/blob/master/LICENSE). +This project is licensed under [The MIT License (MIT)](https://github.com/greatbsky/react-native-pull/blob/master/LICENSE). \ No newline at end of file diff --git a/en/react-native-scrollable-tab-view.md b/en/react-native-scrollable-tab-view.md index f0c98c6c..a5deb72c 100644 --- a/en/react-native-scrollable-tab-view.md +++ b/en/react-native-scrollable-tab-view.md @@ -18,7 +18,7 @@ ## Installation and Usage -Find the matching version information in the release address of a third-party library：[@react-native-oh-tpl/react-native-scrollable-tab-view Releases](https://github.com/react-native-oh-library/react-native-scrollable-tab-view/releases).For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. +Find the matching version information in the release address of a third-party library: [@react-native-oh-tpl/react-native-scrollable-tab-view Releases](https://github.com/react-native-oh-library/react-native-scrollable-tab-view/releases). For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. Go to the project directory and execute the following instruction: @@ -66,9 +66,9 @@ export default () => { ## Link -The HarmonyOS implementation of this library relies on the native code of @react-native-oh-tpl/react-native-pager-view，If the library has already been introduced in the HarmonyOS project, there is no need to introduce it again. You can skip the steps in this chapter and use it directly. +The HarmonyOS implementation of this library relies on the native code of @react-native-oh-tpl/react-native-pager-view. If the library has already been introduced in the HarmonyOS project, there is no need to introduce it again.You can skip the steps in this chapter and use it directly. -If not introduced, please refer to the Link section of the document[@react-native-oh-tpl/react-native-pager-view](react-native-pager-view.md#link)for introduction. +If not introduced, please refer to the Link section of the document [@react-native-oh-tpl/react-native-pager-view](react-native-pager-view.md#link) for introduction. ## Constraints @@ -86,23 +86,23 @@ Check the release version information in the release address of the third-party | Name | Description | Type | Required | Platform | HarmonyOS Support | | -------------------------- | ------------------------------------------------------------ | -------------------- | -------- | ------------ | ----------------- | -| renderTabBar | 用于渲染TabBar。添加该属性，需要在引入组件之时加上它的子组件。系统提供两种方式，DefaultTabBar和ScrollableTabBar。DefaultTabBar表示Tab.item会平分水平方向上的空间，而ScrollableTabBar表示所有的tabBar.item的长度将会超过屏幕宽度，但是当滚动屏幕之时可以显示出来。当然也可以自定义它的模式。 | Function | no | ios，android | yes | -| tabBarPosition | 表示TabBar的位置。一共有四个取值：top(放在界面上方)、bottom(放在界面底部)、overlayTop(有悬浮效果在上方)、overlayBottom(有悬浮效果在下方) | String | no | ios，android | yes | -| onChangeTab | 切换界面的时候会调用该方法，该属性中包含一个参数，它是一个object对象，这个对象有两个参数，i表示被选中的下标，ref表示被选中的对象。 | Function | no | ios，android | yes | -| onScroll | 视图滑动时调用，该属性会传递一个Float类型的数字，范围是[0,tab的数量-1] | Function | no | ios，android | yes | -| locked | 手指是否能拖动，默认为false（可拖动）,如为true则表示只能通过点击tab来切换视图。 | Bool | no | ios，android | yes | -| initialPage | 初始化时被选中的下标，默认为0 | Integer | no | ios，android | yes | -| page | 设置选中指定的tab(已废弃,详情请看 [#126](https://github.com/ptomasroos/react-native-scrollable-tab-view/issues/126)) | Integer | no | ios,android | no | -| children | 每个顶级子组件都应该有一个tabLabel属性，选项卡栏组件可以使用它来呈现标签。默认是字符串，但也可以自定义内容。 | ReactComponents | no | ios，android | yes | -| tabBarUnderlineStyle | 设置选项卡栏下划线的样式。注意，该属性只是在系统提供的ScrollableTabBarTab状态下才有效果。 | View.propTypes.style | no | ios，android | yes | -| tabBarBackgroundColor | 设置选项卡栏背景的颜色，默认为white。 | String | no | ios，android | yes | -| tabBarActiveTextColor | 设置选中的tabBar的文字颜色,默认navy。 | String | no | ios，android | yes | -| tabBarInactiveTextColor | 设置未选中的tabBar的文字颜色,默认black。 | String | no | android,ios | yes | -| tabBarTextStyle | 选项卡栏文本的其他样式。例如：{fontFamily: 'Roboto', fontSize: 15} | Object | no | android,ios | yes | -| style | view所拥有的属性 | View.propTypes.style | no | android,ios | yes | -| contentProps | 应用于ScrollView/ViewPagerAndroid的属性。请注意，重写库设置的默认值可能会破坏功能； | Object | no | android,ios | yes | -| scrollWithoutAnimation | 设置点击Tab时，视图切换是否有动画，默认为false（即：有动画效果）。 | Bool | no | android,ios | yes | -| prerenderingSiblingsNumber | 预渲染附近的同级，Infinity===渲染所有同级，默认为0===渲染当前页面。 | Integer | no | android,ios | yes | +| renderTabBar | Renders the tab bar. To add this property, you need to add its subcomponents when introducing the component. The system provides two tab bar types: **DefaultTabBar** and **ScrollableTabBar**. **DefaultTabBar** indicates that tab items are evenly distributed in the horizontal space. **ScrollableTabBar** indicates that the length of all tab bar items exceeds the screen width, but they can be displayed when the screen is scrolled. You can also customize the mode. | Function | no | iOS, Android | yes | +| tabBarPosition | Indicates the position of the tab bar. You can set this parameter to **top** (on the top of the UI), **bottom** (on the bottom of the UI), **overlayTop** (on the top with the floating effect), or **overlayBottom** (on the bottom with the floating effect). | String | no | iOS, Android | yes | +| onChangeTab | Called when the tab is switched. This function contains a parameter, which is an object containing two parameters: **i** indicates the selected index of the tab, and **ref** indicates the selected tab. | Function | no | iOS, Android | yes | +| onScroll | Called when the view slides. This function contains a parameter, which is a number of the Float type. Value range: [0, number of tabs – 1]. | Function | no | iOS, Android | yes | +| locked | Indicates whether the tab can be dragged. The default value is **false**, indicating that the tab can be dragged. If the value is **true**, the view can be switched only by clicking the tab. | Bool | no | iOS, Android | yes | +| initialPage | Indicates the index of the selected tab during initialization. The default value is **0**. | Integer | no | iOS, Android | yes | +| page | Sets the selected tab. This property is deprecated. For details, see [#126](https://github.com/ptomasroos/react-native-scrollable-tab-view/issues/126). | Integer | no | iOS, Android | no | +| children | Each top-level child component should have a **tabLabel** property that can be used by the tab bar component to render out the labels. The default value of the tab bar is a string. You can also customize the value. | ReactComponents | no | iOS, Android | yes | +| tabBarUnderlineStyle | Sets the underline style of the tab bar. Note that this property is valid only in the **ScrollableTabBarTab** state provided by the system. | View.propTypes.style | no | iOS, Android | yes | +| tabBarBackgroundColor | Sets the background color of the tab bar. The default color is **white**. | String | no | iOS, Android | yes | +| tabBarActiveTextColor | Sets the text color of the selected tab bar. The default value is **navy**. | String | no | iOS, Android | yes | +| tabBarInactiveTextColor | Sets the text color of the tab bar that is not selected. The default value is **black**. | String | no | Android, iOS | yes | +| tabBarTextStyle | Sets other styles of the tab bar text. Example: {fontFamily: 'Roboto', fontSize: 15} | Object | no | Android, iOS | yes | +| style | Indicates a property of View. | View.propTypes.style | no | Android, iOS | yes | +| contentProps | Indicates a property applied to **ScrollView** and **ViewPagerAndroid**. Note that overriding the default values set by the library may damage the functionality. | Object | no | Android, iOS | yes | +| scrollWithoutAnimation | Sets whether animation is displayed during view switching when a tab is clicked. The default value is **false**, indicating that animation is displayed. | Bool | no | Android, iOS | yes | +| prerenderingSiblingsNumber | Pre-renders the nearby siblings. If this property is set to **Infinity**, all siblings are rendered. The default value is **0**, indicating that the current page is rendered. | Integer | no | Android, iOS | yes | ## Known Issues @@ -112,4 +112,4 @@ Check the release version information in the release address of the third-party ## License -This project is licensed under [The MIT License (MIT)](https://www.mit-license.org/). +This project is licensed under [The MIT License (MIT)](https://www.mit-license.org/). \ No newline at end of file diff --git a/en/react-native-stickyheader.md b/en/react-native-stickyheader.md index 7e944050..5ee6c6cd 100644 --- a/en/react-native-stickyheader.md +++ b/en/react-native-stickyheader.md @@ -18,7 +18,7 @@ ## Installation and Usage -Find the matching version information in the release address of a third-party library: [@react-native-oh-tpl/react-native-stickyheader Releases](https://github.com/react-native-oh-library/react-native-stickyheader/releases).For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. +Find the matching version information in the release address of the third-party library: [@react-native-oh-tpl/react-native-stickyheader Releases](https://github.com/react-native-oh-library/react-native-stickyheader/releases). For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. Go to the project directory and execute the following instruction: @@ -87,10 +87,10 @@ function App() { )} scrollEventThrottle={1} > - 文字 - 文字 - 文字 - 文字 + Text + Text + Text + Text [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library. +> [!tip] The **Platform** column indicates the platform where the properties are supported in the original third-party library. -> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. +> [!tip] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -此组件有以下属性: +Available properties: -| Property | Type | Required | Description | Platform | HarmonyOS
Support | -| ------------- | ------ | -------- | ----------------- | ---------------- | ---------------------- | -| StickyHeaderY | number | NO | 滑动到多少悬浮 | Android
IOS | YES | -| StickyScrollY | any | Yes | 动画的ScrollY回调 | Android
IOS | YES | +| Property | Type | Required | Description | Platform | HarmonyOS
Support | +| ------------- | ------ | -------- | ------------------------------------------------------ | --------------- | --------------------- | +| StickyHeaderY | number | NO | The scrolling distance where the sticky header is used | Android
IOS | YES | +| StickyScrollY | any | Yes | Callback of the **ScrollY** animation | Android
IOS | YES | ## Known Issues @@ -145,6 +145,4 @@ This document is verified based on the following versions: ## License -This project is licensed under [The MIT License (MIT)](https://github.com/jiasongs/react-native-stickyheader/blob/master/LICENSE). - - +This project is licensed under [The MIT License (MIT)](https://github.com/jiasongs/react-native-stickyheader/blob/master/LICENSE). \ No newline at end of file diff --git a/en/react-native-swiper.md b/en/react-native-swiper.md index b0e2612b..0ccb676c 100644 --- a/en/react-native-swiper.md +++ b/en/react-native-swiper.md @@ -95,8 +95,8 @@ AppRegistry.registerComponent("myproject", () => SwiperComponent); This document is verified based on the following versions: -1. RNOH：0.72.13; SDK：HarmonyOS NEXT Developer Preview1; IDE：DevEco Studio 4.1.3.500; ROM：2.0.0.58; -2. RNOH：0.72.33; SDK：OpenHarmony 5.0.0.71(API Version 12 Release); IDE：DevEco Studio 5.0.3.900; ROM：NEXT.0.0.71; +1. RNOH: 0.72.13; SDK: HarmonyOS NEXT Developer Preview1; IDE: DevEco Studio 4.1.3.500; ROM: 2.0.0.58; +2. RNOH: 0.72.33; SDK: OpenHarmony 5.0.0.71 (API Version 12 Release); IDE: DevEco Studio 5.0.3.900; ROM: NEXT.0.0.71; ## Properties @@ -123,7 +123,7 @@ This document is verified based on the following versions: | height | If no specify default fullscreen mode by `flex: 1`. | `number` | - | All | YES | | style | See default style in source. | `style` | {...} | All | YES | | containerStyle | See default container style in source. | `style` | {...} | All | YES | -| loadMinimal | Only load current index slide , `loadMinimalSize` slides before and after. | `bool` | false | All | YES | +| loadMinimal | Only load current index slide, `loadMinimalSize` slides before and after. | `bool` | false | All | YES | | loadMinimalSize | see `loadMinimal` | `number` | 1 | All | YES | | loadMinimalLoader | Custom loader to display when slides aren't loaded | `element` | `` | All | YES | @@ -151,12 +151,12 @@ This document is verified based on the following versions: #### Control buttons -| Prop | Default | Type | Description | platform | HarmonyOS Support | remark | -| :----------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :-------: | :------------------------------------------ | -------- | ----------------- | ------ | -| showsButtons | true | `bool` | Set to `true` make control buttons visible. | All | YES | -- | +| Prop | Default | Type | Description | platform | HarmonyOS Support | remark | +| :----------------- | :----------------------------------------------------------: | :-------: | :------------------------------------------ | -------- | ----------------- | ------ | +| showsButtons | true | `bool` | Set to `true` make control buttons visible. | All | YES | -- | | buttonWrapperStyle | `{backgroundColor: 'transparent', flexDirection: 'row', position: 'absolute', top: 0, left: 0, flex: 1, paddingHorizontal: 10, paddingVertical: 10, justifyContent: 'space-between', alignItems: 'center'}` | `style` | Custom styles. | All | YES | -- | -| nextButton | `›` | `element` | Allow custom the next button. | All | YES | -- | -| prevButton | `‹` | `element` | Allow custom the prev button. | All | YES | -- | +| nextButton | `›` | `element` | Allow custom the next button. | All | YES | -- | +| prevButton | `‹` | `element` | Allow custom the prev button. | All | YES | -- | #### Props of Children @@ -174,9 +174,9 @@ This document is verified based on the following versions: | showsHorizontalScrollIndicator | Set to `true` if you want to show horizontal scroll bar. | `bool` | false | All | YES | -- | | showsVerticalScrollIndicator | Set to `true` if you want to show vertical scroll bar. | `bool` | false | All | YES | -- | | bounces | If `true`, the scroll view bounces when it reaches the end of the content if the content is larger then the scroll view along the axis of the scroll direction. If `false`, it disables all bouncing even if the alwaysBounce\* props are true. | `bool` | false | All | YES | -- | -| scrollsToTop | If true, the scroll view scrolls to top when the status bar is tapped. | `bool` | false | All | NO | 组件属性继承RNOH scrollview,当前RNOH中的scrollsToTop暂时不支持 | -| removeClippedSubviews | If true, offscreen child views (whose overflow value is hidden) are removed from their native backing superview when offscreen. This canimprove scrolling performance on long lists. | `bool` | true | All | NO | 组件属性继承RNOH scrollview,当前RNOH中的removeClippedSubviews暂时不支持 | -| automaticallyAdjustContentInsets | Set to `true` if you need adjust content insets automation. | `bool` | false | All | NO | 组件属性继承RNOH scrollview,当前RNOH中的automaticallyAdjustContentInsets暂时不支持 | +| scrollsToTop | If true, the scroll view scrolls to top when the status bar is tapped. | `bool` | false | All | NO | This component property is inherited from RNOH **scrollview**. Currently, **scrollsToTop** in RNOH is not supported. | +| removeClippedSubviews | If true, offscreen child views (whose overflow value is hidden) are removed from their native backing superview when offscreen. This canimprove scrolling performance on long lists. | `bool` | true | All | NO | This component property is inherited from RNOH **scrollview**. Currently, **removeClippedSubviews** in RNOH is not supported. | +| automaticallyAdjustContentInsets | Set to `true` if you need adjust content insets automation. | `bool` | false | All | NO | This component property is inherited from RNOH **scrollview**. Currently, **automaticallyAdjustContentInsets** in RNOH is not supported. | | scrollEnabled | Enables/Disables swiping | `bool` | true | All | YES | -- | > @see: http://facebook.github.io/react-native/docs/scrollview.html @@ -221,13 +221,13 @@ var swiper = React.createClass({ ### Known Issues -- [ ] 组件属性继承RNOH scrollview,当前RNOH中的scrollsToTop暂时不支持 -- [ ] 组件属性继承RNOH scrollview,当前RNOH中的removeClippedSubviews暂时不支持 -- [ ] 组件属性继承RNOH scrollview,当前RNOH中的automaticallyAdjustContentInsets暂时不支持 -- [ ] 组件轮播图RNOH版本为0.72.13暂时有不居中问题，在RNOH版本为0.72.19上解决 +- [ ] The **scrollsToTop** property is inherited from RNOH **scrollview**. Currently, **scrollsToTop** in RNOH is not supported. +- [ ] The **removeClippedSubviews** property is inherited from RNOH **scrollview**. Currently, **removeClippedSubviews** in RNOH is not supported. +- [ ] The **automaticallyAdjustContentInsets** property is inherited from RNOH **scrollview**. Currently, **automaticallyAdjustContentInsets** in RNOH is not supported. +- [ ] In the RNOH version 0.72.13, the swiper component cannot be centered. This problem is solved in the RNOH version 0.72.19. ### Others ### License -This project is licensed under [The MIT License (MIT)](https://github.com/leecade/react-native-swiper/blob/master/LICENSE). +This project is licensed under [The MIT License (MIT)](https://github.com/leecade/react-native-swiper/blob/master/LICENSE). \ No newline at end of file diff --git a/en/react-native-video.md b/en/react-native-video.md index ee2aac60..f0ec86a9 100644 --- a/en/react-native-video.md +++ b/en/react-native-video.md @@ -16,7 +16,7 @@ ## Installation and Usage -Find the matching version information in the release address of a third-party library: [@react-native-oh-tpl/react-native-video Releases](https://github.com/react-native-oh-library/react-native-video/releases).For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. +Find the matching version information in the release address of the third-party library: [@react-native-oh-tpl/react-native-video Releases](https://github.com/react-native-oh-library/react-native-video/releases). For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. Go to the project directory and execute the following instruction: @@ -111,7 +111,7 @@ function RNCVideoDemo() { return ( - 网络视频demo + Online video demo; {onVideoLoad} {onVideoError} {onVideoLoadStart} @@ -137,7 +137,7 @@ function RNCVideoDemo() { setPosterResizeMode("stretch"); }} > - 切换net:vmallres + Switch to https://res.vmallres.com. - 切换net:oceans + Switch to https://vjs.zencdn.net/v/oceans.mp4. set resizeMode @@ -197,7 +197,7 @@ function RNCVideoDemo() { padding: 0, }} > - 操作 + Operation; [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library. - -> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. - -详情请查看[react-native-video 官方文档](https://github.com/react-native-video/react-native-video/blob/support/5.2.X/README.md) - -| Name | Descriptio | Type | Required | Platform | HarmonyOS Support | -| ---- | -------------------------- | :----- | --------- | -------- |------------------ | -| `source`| Sets the media source. You can pass an asset loaded via require or an object with a uri.| object | Yes | All | yes | -| `disableFocus` | Determines whether video audio should override background music/audio in Android and HarmonyOS devices.
**false (default)** | boolean | No | Android Exoplayer | yes | -| `muted` | Controls whether the audio is muted.
**false (default)** - Don't mute audio | boolean | No | All | yes | -| `paused` | Controls whether the media is paused.
**false (default)** - Don't pause the media | boolean | No | All | yes | -| `repeat` | Determine whether to repeat the video when the end is reached.
**false (default)** - Don't repeat the video | boolean | No | All | yes | -| `resizeMode` | Determines how to resize the video when the frame doesn't match the raw video dimensions.
**"none" (default)** - Don't apply resize | string | No | Android ExoPlayer, Android MediaPlayer, iOS, Windows UWP | yes | -| `volume` | Adjust the volume.
**1.0 (default)** - Play at full volume | number | No | All | yes | -| `poster` | An image to display while the video is loading
Value: string with a URL for the poster, e.g. "" | string | No | All | yes | -| `posterResizeMode` | Determines how to resize the poster image when the frame doesn't match the raw video dimensions..
**"contain" (default)**- Scale the image uniformly (maintain the image's aspect ratio) so that both dimensions (width and height) of the image will be equal to or less than the corresponding dimension of the view (minus padding). | string | No | All | yes | -| `allowsExternalPlayback` | Indicates whether the player allows switching to external playback mode such as AirPlay or HDMI. | boolean | No | iOS | No | -| `audioOnly` | Indicates whether the player should only play the audio track and instead of displaying the video track, show the poster instead. | boolean | No | All | No | -| `onPlaybackStalled` | The callback when the buffer starts caching, controls the display of the loading view | boolean | No | Android | No | -| `onPlaybackResume` | The callback when the buffer ends caching, controlling the hiding of the loading view | boolean | No | Android | No | -| `automaticallyWaitsToMinimizeStalling` | A Boolean value that indicates whether the player should automatically delay playback in order to minimize stalling. For clients linked against iOS 10.0 and later | boolean | No | iOS | No | -| `bufferConfig` | Adjust the buffer settings. This prop takes an object with one or more of the properties listed below. | object | No | Android | No | -| `controls` |Determines whether to show player controls. | boolean | No | All | Yes | -| `currentPlaybackTime` |When playing an HLS live stream with a EXT-X-PROGRAM-DATE-TIME tag configured, then this property will contain the epoch value in msec.| string | No | All | No | -| `filter` |Add video filter| string | No | iOS | No | -| `filterEnabled` |Enable video filter.| string | No | iOS | No | -| `fullscreen` |Controls whether the player enters fullscreen on play.| boolean | No | iOS | No | -| `fullscreenAutorotate` |If a preferred fullscreenOrientation is set, causes the video to rotate to that orientation but permits rotation of the screen to orientation held by user. Defaults to TRUE.| boolean | No | iOS | No | -| `fullscreenOrientation` |Full screen orientation is set.| string | No | iOS | No | -| `headers` |Pass headers to the HTTP client. Can be used for authorization. Headers must be a part of the source object.| object | No | Android | No | -| `hideShutterView` |Controls whether the ExoPlayer shutter view (black screen while loading) is enabled.| boolean | No | Android | No | -| `id` |Set the DOM id element so you can use document.getElementById on web platforms. Accepts string values.| string | No | All | No | -| `ignoreSilentSwitch` |Controls the iOS silent switch behavior| string | No | iOS | No | -| `maxBitRate` |Sets the desired limit, in bits per second, of network bandwidth consumption when multiple video streams are available for a playlist.| number | No | All | No | -| `minLoadRetryCount` |Sets the minimum number of times to retry loading data before failing and reporting an error to the application. Useful to recover from transient internet failures.| number | No | Android | No | -| `mixWithOthers` |Controls how Audio mix with other apps.| string | No | iOS | No | -| `pictureInPicture` |Determine whether the media should played as picture in picture.| boolean | No | iOS | No | -| `playInBackground` |Determine whether the media should continue playing while the app is in the background. This allows customers to continue listening to the audio.| boolean | No | All | No | -| `playWhenInactive` |Determine whether the media should continue playing when notifications or the Control Center are in front of the video.| boolean | No | iOS | No | -| `preferredForwardBufferDuration` |The duration the player should buffer media from the network ahead of the playhead to guard against playback disruption. Sets the preferredForwardBufferDuration instance property on AVPlayerItem.| number | No | iOS | No | -| `preventsDisplaySleepDuringVideoPlayback` |Controls whether or not the display should be allowed to sleep while playing the video. Default is not to allow display to sleep.| boolean | No | All | No | -| `progressUpdateInterval` |Delay in milliseconds between onProgress events in milliseconds.| number | No | iOS | No | -| `rate` |Speed at which the media should play.| number | No | All | No | -| `reportBandwidth` |Determine whether to generate onBandwidthUpdate events. This is needed due to the high frequency of these events on ExoPlayer.| boolean | No | Android | No | -| `selectedAudioTrack` |Configure which audio track, if any, is played.| object | No | All | No | -| `selectedTextTrack` |Configure which text track (caption or subtitle), if any, is shown.| object | No | All | No | -| `selectedVideoTrack` |Configure which video track should be played. By default, the player uses Adaptive Bitrate Streaming to automatically select the stream it thinks will perform best based on available bandwidth.| object | No | Android | No | -| `stereoPan` |Adjust the balance of the left and right audio channels. Any value between –1.0 and 1.0 is accepted.| number | No | Android | No | -| `textTracks` |Load one or more "sidecar" text tracks. This takes an array of objects representing each track. | object | No | All | No | -| `trackId` |Configure an identifier for the video stream to link the playback context to the events emitted. | string | No | Android | No | -| `useTextureView` |Controls whether to output to a TextureView or SurfaceView. | boolean | No | Android | No | - -## 事件回调 - -> [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library. - -> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. - -| Name | Description | Type | Required | Platform | HarmonyOS Support | -| ------------------- | ------------------------------------------------------------------------------------------------------------------------------------ | :------- | -------- | ------------------------------------------------ | ----------------- | -| `onLoad` | Callback function that is called when the media is loaded and ready to play. | function | No | All | yes | -| `onLoadStart` | Callback function that is called when the media starts loading. | function | No | All | yes | -| `onReadyForDisplay` | Callback function that is called when the first video frame is ready for display. This is when the poster is removed. | function | No | Android ExoPlayer, Android MediaPlayer, iOS, Web | yes | -| `onProgress` | Callback function that is called every progressUpdateInterval seconds with info about which position the media is currently playing. | function | No | All | yes | -| `onEnd` | Callback function that is called when the player reaches the end of the media. | function | No | All | yes | -| `onError` | Callback function that is called when the player experiences a playback error. | function | No | All | yes | -| `onBuffer` | Callback function that is called when the player buffers. | function | No | Android, iOS | yes | -| `onPlaybackStalled` | Callback function that is MediaPlayer MEDIA_INFO_BUFFERING_START | function | No | Android MediaPlayer | yes | -| `onPlaybackResume` | Callback function that is MediaPlayer MEDIA_INFO_BUFFERING_END | function | No | Android MediaPlayer | yes | -| `onAudioBecomingNoisy` | Callback function that is called when the audio is about to become 'noisy' due to a change in audio outputs. Typically this is called when audio output is being switched from an external source like headphones back to the internal speaker. It's a good idea to pause the media when this happens so the speaker doesn't start blasting sound. | function | No | All | No | -| `onBandwidthUpdate` | Callback function that is called when the available bandwidth changes. | function | No | Android | No | -| `onExternalPlaybackChange` | Callback function that is called when external playback mode for current playing video has changed. Mostly useful when connecting/disconnecting to Apple TV – it's called on connection/disconnection. | function | No | iOS | No | -| `onFullscreenPlayerWillPresent` | Callback function that is called when the player is about to enter fullscreen mode. | function | No | All | No | -| `onFullscreenPlayerDidPresent` |Callback function that is called when the player has entered fullscreen mode. | function | No | All | No | -| `onFullscreenPlayerWillDismiss` |Callback function that is called when the player is about to exit fullscreen mode. | function | No | All | No | -| `onFullscreenPlayerDidDismiss` |Callback function that is called when the player has exited fullscreen mode. | function | No | All | No | -| `onLoadStart` |Callback function that is called when the media starts loading. | function | No | All | No | -| `onReadyForDisplay` |Callback function that is called when the first video frame is ready for display. This is when the poster is removed. | function | No | All | No | -| `onPictureInPictureStatusChanged` |Callback function that is called when picture in picture becomes active or inactive. | function | No | IOS | No | -| `onPlaybackRateChange` |Callback function that is called when the rate of playback changes - either paused or starts/resumes. | function | No | All | No | -| `onSeek` |Callback function that is called when a seek completes. | function | No | All | No | -| `onRestoreUserInterfaceForPictureInPictureStop` |Callback function that corresponds to Apple's restoreUserInterfaceForPictureInPictureStopWithCompletionHandler. Call restoreUserInterfaceForPictureInPictureStopCompleted inside of this function when done restoring the user | function | No | iOS | No | -| `onTimedMetadata` |Callback function that is called when timed metadata becomes available | function | No | All | No | +> [!tip] The **Platform** column indicates the platform where the properties are supported in the original third-party library. + +> [!tip] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. + +For details, see [React-Native-Video Official Document](https://github.com/react-native-video/react-native-video/blob/support/5.2.X/README.md). + +| Name | Descriptio | Type | Required | Platform | HarmonyOS Support | +| ----------------------------------------- | ------------------------------------------------------------ | :------ | -------- | -------------------------------------------------------- | ----------------- | +| `source` | Sets the media source. You can pass an asset loaded via require or an object with a uri. | object | Yes | All | yes | +| `disableFocus` | Determines whether video audio should override background music/audio in Android and HarmonyOS devices.
**false (default)** | boolean | No | Android Exoplayer | yes | +| `muted` | Controls whether the audio is muted.
**false (default)** - Don't mute audio | boolean | No | All | yes | +| `paused` | Controls whether the media is paused.
**false (default)** - Don't pause the media | boolean | No | All | yes | +| `repeat` | Determine whether to repeat the video when the end is reached.
**false (default)** - Don't repeat the video | boolean | No | All | yes | +| `resizeMode` | Determines how to resize the video when the frame doesn't match the raw video dimensions.
**"none" (default)** - Don't apply resize | string | No | Android ExoPlayer, Android MediaPlayer, iOS, Windows UWP | yes | +| `volume` | Adjust the volume.
**1.0 (default)** - Play at full volume | number | No | All | yes | +| `poster` | An image to display while the video is loading
Value: string with a URL for the poster, e.g. "" | string | No | All | yes | +| `posterResizeMode` | Determines how to resize the poster image when the frame doesn't match the raw video dimensions..
**"contain" (default)**- Scale the image uniformly (maintain the image's aspect ratio) so that both dimensions (width and height) of the image will be equal to or less than the corresponding dimension of the view (minus padding). | string | No | All | yes | +| `allowsExternalPlayback` | Indicates whether the player allows switching to external playback mode such as AirPlay or HDMI. | boolean | No | iOS | No | +| `audioOnly` | Indicates whether the player should only play the audio track and instead of displaying the video track, show the poster instead. | boolean | No | All | No | +| `onPlaybackStalled` | The callback when the buffer starts caching, controls the display of the loading view | boolean | No | Android | No | +| `onPlaybackResume` | The callback when the buffer ends caching, controlling the hiding of the loading view | boolean | No | Android | No | +| `automaticallyWaitsToMinimizeStalling` | A Boolean value that indicates whether the player should automatically delay playback in order to minimize stalling. For clients linked against iOS 10.0 and later | boolean | No | iOS | No | +| `bufferConfig` | Adjust the buffer settings. This prop takes an object with one or more of the properties listed below. | object | No | Android | No | +| `controls` | Determines whether to show player controls. | boolean | No | All | Yes | +| `currentPlaybackTime` | When playing an HLS live stream with a EXT-X-PROGRAM-DATE-TIME tag configured, then this property will contain the epoch value in msec. | string | No | All | No | +| `filter` | Add video filter | string | No | iOS | No | +| `filterEnabled` | Enable video filter. | string | No | iOS | No | +| `fullscreen` | Controls whether the player enters fullscreen on play. | boolean | No | iOS | No | +| `fullscreenAutorotate` | If a preferred fullscreenOrientation is set, causes the video to rotate to that orientation but permits rotation of the screen to orientation held by user. Defaults to TRUE. | boolean | No | iOS | No | +| `fullscreenOrientation` | Full screen orientation is set. | string | No | iOS | No | +| `headers` | Pass headers to the HTTP client. Can be used for authorization. Headers must be a part of the source object. | object | No | Android | No | +| `hideShutterView` | Controls whether the ExoPlayer shutter view (black screen while loading) is enabled. | boolean | No | Android | No | +| `id` | Set the DOM id element so you can use document.getElementById on web platforms. Accepts string values. | string | No | All | No | +| `ignoreSilentSwitch` | Controls the iOS silent switch behavior | string | No | iOS | No | +| `maxBitRate` | Sets the desired limit, in bits per second, of network bandwidth consumption when multiple video streams are available for a playlist. | number | No | All | No | +| `minLoadRetryCount` | Sets the minimum number of times to retry loading data before failing and reporting an error to the application. Useful to recover from transient internet failures. | number | No | Android | No | +| `mixWithOthers` | Controls how Audio mix with other apps. | string | No | iOS | No | +| `pictureInPicture` | Determine whether the media should be played as picture in picture. | boolean | No | iOS | No | +| `playInBackground` | Determine whether the media should continue playing while the app is in the background. This allows customers to continue listening to the audio. | boolean | No | All | No | +| `playWhenInactive` | Determine whether the media should continue playing when notifications or the Control Center are in front of the video. | boolean | No | iOS | No | +| `preferredForwardBufferDuration` | The duration the player should buffer media from the network ahead of the playhead to guard against playback disruption. Sets the preferredForwardBufferDuration instance property on AVPlayerItem. | number | No | iOS | No | +| `preventsDisplaySleepDuringVideoPlayback` | Controls whether the display should be allowed to sleep while playing the video. Default is not to allow display to sleep. | boolean | No | All | No | +| `progressUpdateInterval` | Delay in milliseconds between onProgress events in milliseconds. | number | No | iOS | No | +| `rate` | Speed at which the media should play. | number | No | All | No | +| `reportBandwidth` | Determine whether to generate onBandwidthUpdate events. This is needed due to the high frequency of these events on ExoPlayer. | boolean | No | Android | No | +| `selectedAudioTrack` | Configure which audio track, if any, is played. | object | No | All | No | +| `selectedTextTrack` | Configure which text track (caption or subtitle), if any, is shown. | object | No | All | No | +| `selectedVideoTrack` | Configure which video track should be played. By default, the player uses Adaptive Bitrate Streaming to automatically select the stream it thinks will perform best based on available bandwidth. | object | No | Android | No | +| `stereoPan` | Adjust the balance of the left and right audio channels. Any value between –1.0 and 1.0 is accepted. | number | No | Android | No | +| `textTracks` | Load one or more "sidecar" text tracks. This takes an array of objects representing each track. | object | No | All | No | +| `trackId` | Configure an identifier for the video stream to link the playback context to the events emitted. | string | No | Android | No | +| `useTextureView` | Controls whether to output to a TextureView or SurfaceView. | boolean | No | Android | No | + +## Event Callbacks + +> [!tip] The **Platform** column indicates the platform where the properties are supported in the original third-party library. + +> [!tip] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. + +| Name | Description | Type | Required | Platform | HarmonyOS Support | +| ----------------------------------------------- | ------------------------------------------------------------ | :------- | -------- | ------------------------------------------------ | ----------------- | +| `onLoad` | Callback function that is called when the media is loaded and ready to play. | function | No | All | yes | +| `onLoadStart` | Callback function that is called when the media starts loading. | function | No | All | yes | +| `onReadyForDisplay` | Callback function that is called when the first video frame is ready for display. This is when the poster is removed. | function | No | Android ExoPlayer, Android MediaPlayer, iOS, Web | yes | +| `onProgress` | Callback function that is called every progressUpdateInterval seconds with info about which position the media is currently playing. | function | No | All | yes | +| `onEnd` | Callback function that is called when the player reaches the end of the media. | function | No | All | yes | +| `onError` | Callback function that is called when the player experiences a playback error. | function | No | All | yes | +| `onBuffer` | Callback function that is called when the player buffers. | function | No | Android, iOS | yes | +| `onPlaybackStalled` | Callback function that is MediaPlayer MEDIA_INFO_BUFFERING_START | function | No | Android MediaPlayer | yes | +| `onPlaybackResume` | Callback function that is MediaPlayer MEDIA_INFO_BUFFERING_END | function | No | Android MediaPlayer | yes | +| `onAudioBecomingNoisy` | Callback function that is called when the audio is about to become 'noisy' due to a change in audio outputs. Typically this is called when audio output is being switched from an external source like headphones back to the internal speaker. It's a good idea to pause the media when this happens so the speaker doesn't start blasting sound. | function | No | All | No | +| `onBandwidthUpdate` | Callback function that is called when the available bandwidth changes. | function | No | Android | No | +| `onExternalPlaybackChange` | Callback function that is called when external playback mode for current playing video has changed. Mostly useful when connecting/disconnecting to Apple TV – it's called on connection/disconnection. | function | No | iOS | No | +| `onFullscreenPlayerWillPresent` | Callback function that is called when the player is about to enter fullscreen mode. | function | No | All | No | +| `onFullscreenPlayerDidPresent` | Callback function that is called when the player has entered fullscreen mode. | function | No | All | No | +| `onFullscreenPlayerWillDismiss` | Callback function that is called when the player is about to exit fullscreen mode. | function | No | All | No | +| `onFullscreenPlayerDidDismiss` | Callback function that is called when the player has exited fullscreen mode. | function | No | All | No | +| `onLoadStart` | Callback function that is called when the media starts loading. | function | No | All | No | +| `onReadyForDisplay` | Callback function that is called when the first video frame is ready for display. This is when the poster is removed. | function | No | All | No | +| `onPictureInPictureStatusChanged` | Callback function that is called when picture in picture becomes active or inactive. | function | No | IOS | No | +| `onPlaybackRateChange` | Callback function that is called when the rate of playback changes - either paused or starts/resumes. | function | No | All | No | +| `onSeek` | Callback function that is called when a seek completes. | function | No | All | No | +| `onRestoreUserInterfaceForPictureInPictureStop` | Callback function that corresponds to Apple's restoreUserInterfaceForPictureInPictureStopWithCompletionHandler. Call restoreUserInterfaceForPictureInPictureStopCompleted inside of this function when done restoring the user | function | No | iOS | No | +| `onTimedMetadata` | Callback function that is called when timed metadata becomes available | function | No | All | No | ## Static Methods -> [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library. +> [!tip] The **Platform** column indicates the platform where the properties are supported in the original third-party library. -> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. +> [!tip] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -| Name | Description | Type | Required | Platform | HarmonyOS Support | -| -------- | -------------------------------------------------------------------------------- | -------- | -------- | -------- | ----------------- | -| `seek()` | Seek to the specified position represented by seconds. seconds is a float value. | function | No | All | yes | -| `dismissFullscreenPlayer()` | Take the player out of fullscreen mode. | function | No | All | No | -| `presentFullscreenPlayer()` | Put the player in fullscreen mode. | function | No | All | No | -| `save()` | Save video to your Photos with current filter prop. Returns promise.| function | No | iOS | No | -| `restoreUserInterfaceForPictureInPictureStop()` | This function corresponds to the completion handler in Apple's recovery user interface ForPictureInPictureStop. IMPORTANT: This function must be called after calling onRestoreUserInterfaceForPictureInPictureStop.| function | No | iOS | No | +| Name | Description | Type | Required | Platform | HarmonyOS Support | +| ----------------------------------------------- | ------------------------------------------------------------ | -------- | -------- | -------- | ----------------- | +| `seek()` | Seek to the specified position represented by seconds. seconds is a float value. | function | No | All | yes | +| `dismissFullscreenPlayer()` | Take the player out of fullscreen mode. | function | No | All | No | +| `presentFullscreenPlayer()` | Put the player in fullscreen mode. | function | No | All | No | +| `save()` | Save video to your Photos with current filter prop. Returns promise. | function | No | iOS | No | +| `restoreUserInterfaceForPictureInPictureStop()` | This function corresponds to the completion handler in Apple's recovery user interface ForPictureInPictureStop. IMPORTANT: This function must be called after calling onRestoreUserInterfaceForPictureInPictureStop. | function | No | iOS | No | ## Known Issues -- [x] source 暂时只支持在线 URL 资源问题： [issue#34](https://github.com/react-native-oh-library/react-native-video/issues/34)。 -- [ ] react-native-video 部分属性和方法未实现 HarmonyOS 化： [issue#60](https://github.com/react-native-oh-library/react-native-video/issues/60)。 +- [x] Currently, only online URL resources are supported: [issue#34](https://github.com/react-native-oh-library/react-native-video/issues/34). +- [ ] Some attributes and methods of react-native-video are not yet compatible: [issue#60](https://github.com/react-native-oh-library/react-native-video/issues/60). ## Others ## License -This project is licensed under [The MIT License (MIT)](https://github.com/TheWidlarzGroup/react-native-video/blob/master/LICENSE). +This project is licensed under [The MIT License (MIT)](https://github.com/TheWidlarzGroup/react-native-video/blob/master/LICENSE). \ No newline at end of file -- Gitee