From af13fcff1dea2d6b5170d3cc428a2754a94a907c Mon Sep 17 00:00:00 2001
From: 17691189070 <1581941486@qq.com>
Date: Fri, 31 May 2024 14:56:28 +0800
Subject: [PATCH 1/3] =?UTF-8?q?docs:=20[Issues:=20#I9TZ55]=E4=BF=AE?=
=?UTF-8?q?=E6=94=B9@react-native-async-storage/async-storage=E6=96=87?=
=?UTF-8?q?=E6=A1=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
...eact-native-async-storage-async-storage.md | 49 ++++++++++++-------
1 file changed, 30 insertions(+), 19 deletions(-)
diff --git a/zh-cn/react-native-async-storage-async-storage.md b/zh-cn/react-native-async-storage-async-storage.md
index f5599bbd..f0479368 100644
--- a/zh-cn/react-native-async-storage-async-storage.md
+++ b/zh-cn/react-native-async-storage-async-storage.md
@@ -43,28 +43,39 @@ yarn add @react-native-oh-tpl/async-storage@file:#
> [!WARNING] 使用时 import 的库名不变。
```js
+import React,{useState} from 'react';
import AsyncStorage from "@react-native-async-storage/async-storage";
+import { View,Text,Button } from "react-native-harmony";
// Storing data
-const storeData = async (value) => {
- try {
- await AsyncStorage.setItem("my-key", value);
- } catch (e) {
- // saving error
- }
-};
-
-// Reading data
-const getData = async () => {
- try {
- const value = await AsyncStorage.getItem("my-key");
- if (value !== null) {
- // value previously stored
- }
- } catch (e) {
- // error reading value
- }
-};
+export function AsyncDemo(): JSX.Element{
+ const [storageValue,setStorageValue] = useState("张三")
+ const storeData = async () => {
+ try {
+ await AsyncStorage.setItem("my-key", "李四");
+ } catch (e) {
+
+ }
+ };
+ // Reading data
+ const getData = async () => {
+ try {
+ const value = await AsyncStorage.getItem("my-key");
+
+ if (value !== null) {
+ setStorageValue(value)
+ }
+
+ } catch (e) {
+
+ }
+ };
+ return
+
+
+ {storageValue}
+
+}
```
## Link
--
Gitee
From 2498455e2f1e30e95f4e5ee77a815936c2479c56 Mon Sep 17 00:00:00 2001
From: 17691189070 <1581941486@qq.com>
Date: Fri, 31 May 2024 15:03:51 +0800
Subject: [PATCH 2/3] =?UTF-8?q?docs:=20[Issues:=20#I9TZB6]=E4=BF=AE?=
=?UTF-8?q?=E6=94=B9@react-native-community/datetimepicker=E6=96=87?=
=?UTF-8?q?=E6=A1=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../react-native-community-datetimepicker.md | 96 +++++++++++--------
1 file changed, 56 insertions(+), 40 deletions(-)
diff --git a/zh-cn/react-native-community-datetimepicker.md b/zh-cn/react-native-community-datetimepicker.md
index 3624af5e..f299a1a2 100644
--- a/zh-cn/react-native-community-datetimepicker.md
+++ b/zh-cn/react-native-community-datetimepicker.md
@@ -43,48 +43,64 @@ yarn add @react-native-oh-tpl/datetimepicker@file:#
> [!WARNING] 使用时 import 的库名不变。
```js
+import React from 'react';
+import { View,Button, Text, SafeAreaView } from 'react-native';
+
import DateTimePicker from '@react-native-community/datetimepicker';
+import { isNil } from 'lodash';
+
+export type AndroidMode = 'date' | 'time';
+
+export type EvtTypes = 'set' | 'neutralButtonPressed' | 'dismissed';
+
+export type DateTimePickerEvent = {
+ type: EvtTypes;
+ nativeEvent: {
+ timestamp: number;
+ utcOffset: number;
+ };
+};
+
+export function DatetimepickerExample() {
+ const [date, setDate] = React.useState(new Date());
+ const [mode, setMode] = React.useState('date' as AndroidMode);
+ const [show, setShow] = React.useState(false);
+
+ const onChange = (event: DateTimePickerEvent, selectedDate?: Date) => {
+ const currentDate = selectedDate;
+ setShow(false);
+ if (!isNil(currentDate)) {
+ setDate(currentDate);
+ }
+ };
+
+ const showMode = (currentMode: AndroidMode) => {
+ setShow(true);
+ setMode(currentMode);
+ };
+
+ const showDatepicker = () => {
+ showMode('date');
+ };
+
+ const showTimepicker = () => {
+ showMode('time');
+ };
-export const App = () => {
- const [date, setDate] = useState(new Date(1598051730000));
- const [mode, setMode] = useState('date');
- const [show, setShow] = useState(false);
-
- const onChange = (event, selectedDate) => {
- const currentDate = selectedDate;
- setShow(false);
- setDate(currentDate);
- };
-
- const showMode = (currentMode) => {
- setShow(true);
- setMode(currentMode);
- };
-
- const showDatepicker = () => {
- showMode('date');
- };
-
- const showTimepicker = () => {
- showMode('time');
- };
-
- return (
-
-
-
- selected: {date.toLocaleString()}
- {show && (
-
- )}
-
- );
+ return (
+
+
+
+ selected: {date.toLocaleString()}
+
+
+ );
};
```
--
Gitee
From 6cd3e35614f2c5274be7376a522e020eb5f3512f Mon Sep 17 00:00:00 2001
From: songningjing <8544658+songningjing@user.noreply.gitee.com>
Date: Fri, 31 May 2024 07:14:44 +0000
Subject: [PATCH 3/3] =?UTF-8?q?=E5=88=A0=E9=99=A4=E6=96=87=E4=BB=B6=20zh-c?=
=?UTF-8?q?n/react-native-community-datetimepicker.md?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../react-native-community-datetimepicker.md | 273 ------------------
1 file changed, 273 deletions(-)
delete mode 100644 zh-cn/react-native-community-datetimepicker.md
diff --git a/zh-cn/react-native-community-datetimepicker.md b/zh-cn/react-native-community-datetimepicker.md
deleted file mode 100644
index f299a1a2..00000000
--- a/zh-cn/react-native-community-datetimepicker.md
+++ /dev/null
@@ -1,273 +0,0 @@
-> 模板版本：v0.1.3
-
-
-
@react-native-community/datetimepicker
-
-
-
- 
-
-
- 
-
-
-
-> [!tip] [Github 地址](https://github.com/react-native-oh-library/datetimepicker)
-
-## 安装与使用
-
-请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/datetimepicker Releases](https://github.com/react-native-oh-library/datetimepicker/releases)，并下载适用版本的 tgz 包
-
-进入到工程目录并输入以下命令：
-
-> [!TIP] # 处替换为 tgz 包的路径
-
-
-
-#### **npm**
-
-```bash
-npm install @react-native-oh-tpl/datetimepicker@file:#
-```
-
-#### **yarn**
-
-```bash
-yarn add @react-native-oh-tpl/datetimepicker@file:#
-```
-
-
-
-快速使用：
-
-> [!WARNING] 使用时 import 的库名不变。
-
-```js
-import React from 'react';
-import { View,Button, Text, SafeAreaView } from 'react-native';
-
-import DateTimePicker from '@react-native-community/datetimepicker';
-import { isNil } from 'lodash';
-
-export type AndroidMode = 'date' | 'time';
-
-export type EvtTypes = 'set' | 'neutralButtonPressed' | 'dismissed';
-
-export type DateTimePickerEvent = {
- type: EvtTypes;
- nativeEvent: {
- timestamp: number;
- utcOffset: number;
- };
-};
-
-export function DatetimepickerExample() {
- const [date, setDate] = React.useState(new Date());
- const [mode, setMode] = React.useState('date' as AndroidMode);
- const [show, setShow] = React.useState(false);
-
- const onChange = (event: DateTimePickerEvent, selectedDate?: Date) => {
- const currentDate = selectedDate;
- setShow(false);
- if (!isNil(currentDate)) {
- setDate(currentDate);
- }
- };
-
- const showMode = (currentMode: AndroidMode) => {
- setShow(true);
- setMode(currentMode);
- };
-
- const showDatepicker = () => {
- showMode('date');
- };
-
- const showTimepicker = () => {
- showMode('time');
- };
-
- return (
-
-
-
- selected: {date.toLocaleString()}
-
-
- );
-};
-```
-
-## Link
-
-目前鸿蒙暂不支持 AutoLink，所以 Link 步骤需要手动配置。
-
-首先需要使用 DevEco Studio 打开项目里的鸿蒙工程 `harmony`
-
-### 引入原生端代码
-
-目前有两种方法：
-
-1. 通过 har 包引入（在 IDE 完善相关功能后该方法会被遗弃，目前首选此方法）；
-2. 直接链接源码。
-
-方法一：通过 har 包引入
-
-> [!TIP] har 包位于三方库安装路径的 `harmony` 文件夹下。
-
-打开 `entry/oh-package.json5`，添加以下依赖
-
-```json
-"dependencies": {
- "@rnoh/react-native-openharmony": "file:../react_native_openharmony",
-
- "rnoh-datetimepicker": "file:../../node_modules/@react-native-oh-tpl/datetimepicker/harmony/datetimepicker.har"
- }
-```
-
-点击右上角的 `sync` 按钮
-
-或者在终端执行：
-
-```bash
-cd entry
-ohpm install
-```
-
-方法二：直接链接源码
-
-> [!TIP] 如需使用直接链接源码，请参考[直接链接源码说明](/zh-cn/link-source-code.md)
-
-### 配置 CMakeLists 和引入 datetimepicker
-
-打开 `entry/src/main/cpp/CMakeLists.txt`，添加：
-
-```diff
-project(rnapp)
-cmake_minimum_required(VERSION 3.4.1)
-set(RNOH_APP_DIR "${CMAKE_CURRENT_SOURCE_DIR}")
-set(OH_MODULE_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../oh_modules")
-set(RNOH_CPP_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../../../../react-native-harmony/harmony/cpp")
-
-add_subdirectory("${RNOH_CPP_DIR}" ./rn)
-
-# RNOH_BEGIN: add_package_subdirectories
-add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package)
-+ add_subdirectory("${OH_MODULE_DIR}/rnoh-datetimepicker/src/main/cpp" ./datetimepicker)
-# RNOH_END: add_package_subdirectories
-
-add_library(rnoh_app SHARED
- "./PackageProvider.cpp"
- "${RNOH_CPP_DIR}/RNOHAppNapiBridge.cpp"
-)
-
-target_link_libraries(rnoh_app PUBLIC rnoh)
-
-# RNOH_BEGIN: link_packages
-target_link_libraries(rnoh_app PUBLIC rnoh_sample_package)
-+ target_link_libraries(rnoh_app PUBLIC rnoh_datetime_picker)
-# RNOH_END: link_packages
-```
-
-打开 `entry/src/main/cpp/PackageProvider.cpp`，添加：
-
-```diff
-#include "RNOH/PackageProvider.h"
-#include "SamplePackage.h"
-+ #include "DateTimePickerPackage.h"
-
-using namespace rnoh;
-
-std::vector> PackageProvider::getPackages(Package::Context ctx) {
- return {
- std::make_shared(ctx),
-+ std::make_shared(ctx)
- };
-}
-```
-
-### 在 ArkTs 侧引入 DateTimePicker 组件
-
-找到 **function buildCustomComponent()**，一般位于 `entry/src/main/ets/pages/index.ets` 或 `entry/src/main/ets/rn/LoadBundle.ets`，添加：
-
-```diff
-...
-import { SampleView, SAMPLE_VIEW_TYPE, PropsDisplayer } from "rnoh-sample-package"
-+ import { RNDateTimePicker, DATETIME_PICKER_VIEW_TYPE } from "rnoh-datetimepicker"
-
-@Builder
-function buildCustomComponent(ctx: ComponentBuilderContext) {
- if (ctx.componentName === SAMPLE_VIEW_TYPE) {
- SampleView({
- ctx: ctx.rnComponentContext,
- tag: ctx.tag,
- buildCustomComponent: buildCustomComponent
- })
- }
-+ else if (ctx.componentName === DATETIME_PICKER_VIEW_TYPE) {
-+ RNDateTimePicker({
-+ ctx: ctx.rnComponentContext,
-+ tag: ctx.tag,
-+ buildCustomComponent: buildCustomComponent
-+ })
-+ }
- ...
-}
-...
-```
-
-### 运行
-
-点击右上角的 `sync` 按钮
-
-或者在终端执行：
-
-```bash
-cd entry
-ohpm install
-```
-
-然后编译、运行即可。
-
-## 兼容性
-
-要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。
-
-请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[<@react-native-oh-library/datetimepicker> Releases](https://github.com/react-native-oh-library/datetimepicker/releases)
-
-## 属性
-
-> [!tip] "Platform"列表示该属性在原三方库上支持的平台。
-
-> [!tip] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。
-
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ----------- | ------------------------------------------------------------------------- | -------- | -------- | ------------------------ | ---------------------------------------------------------- |
-| mode | Defines the type of the picker | string | 否 | All | partially (仅支持 date/time 模式) |
-| style | Sets style directly on picker component. | object | 否 | IOS only | yes |
-| display | Defines the visual display of the picker. The default value is "default". | string | 否 | All | partially (支持"default"，"spinner"，"compact"，"inline") |
-| onChange | Date change handler. | function | 否 | All | partially (仅支持 type 为 set 类型) |
-| value | Defines the date or time value used in the component. | Date | 是 | All | partially (仅 mode=date 且 display=spinner 时支持动态设置) |
-| is24Hour | Allows changing of the time picker to a 24-hour format. | bool | 否 | Windows and Android only | yes |
-| maximumDate | Defines the maximum date that can be selected | Date | 否 | All | partially (仅支持在 mode=date 且 display=spinner 时设置) |
-| minimumDate | Defines the minimum date that can be selected. | Date | 否 | All | partially (仅支持在 mode=date 且 display=spinner 时设置) |
-| disabled | If true, the user won't be able to interact with the view. | bool | 否 | IOS only | yes |
-| textColor | Allows changing of the textColor of the date picker. | string | 否 | IOS only | partially (仅支持在 mode=date 且 display=compact 时设置) |
-
-## 遗留问题
-
-- [x] 已解决：textColor 属性在 compact 和 inline 模式改变值后使用禁用操作，颜色会变白色[issue#17](https://github.com/react-native-oh-library/datetimepicker/issues/17)
-
-- [ ] 部分接口，未适配
-
-## 其他
-
-## 开源协议
-
-本项目基于 [The MIT License (MIT)](https://github.com/react-native-oh-library/datetimepicker/blob/harmony/LICENSE) ，请自由地享受和参与开源。
--
Gitee