update docs

Signed-off-by: N HelloCrease <lian15@huawei.com>

update docs
Signed-off-by: N HelloCrease <lian15@huawei.com>
2dee3348 · HelloCrease · 3d3c18d5 · 2dee3348 · 2dee3348 · 2dee3348
10 changed file
--- a/en/application-dev/application-dev-guide-for-gitee.md
+++ b/en/application-dev/application-dev-guide-for-gitee.md
@@ -54,8 +54,10 @@ To make you better understand how functions work together and jumpstart your app
 API references encompass all components and APIs available in OpenHarmony, helping you use and integrate APIs more effectively.

 They are organized as follows:
-   [Component Reference (JavaScript-based Web-like Development Paradigm)](reference/arkui-js/Readme-EN.md)
+
 - [Component Reference (TypeScript-based Declarative Development Paradigm)](reference/arkui-ts/Readme-EN.md)
+
+-   [Component Reference (JavaScript-based Web-like Development Paradigm)](reference/arkui-js/Readme-EN.md)
 -   APIs
    -   [JS and TS APIs](reference/apis/Readme-EN.md)
    -   Native APIs

--- a/en/application-dev/reference/Readme-EN.md
+++ b/en/application-dev/reference/Readme-EN.md
 # Development References

-   [JavaScript-based Web-like Development Paradigm](arkui-js/Readme-EN.md)
-   [TypeScript-based Declarative Development Paradigm](arkui-ts/Readme-EN.md)
+-   [Component Reference(TypeScript-based Declarative Development Paradigm)](arkui-ts/Readme-EN.md)
+-   [Component Reference(JavaScript-based Web-like Development Paradigm)](arkui-js/Readme-EN.md)
 -   [APIs](apis/Readme-EN.md)

    -   [JS (eTS Included) APIs](apis/Readme-EN.md)

--- a/en/application-dev/ui/Readme-EN.md
+++ b/en/application-dev/ui/Readme-EN.md
 # UI Development

 - [ArkUI Overview](arkui-overview.md)
+- TypeScript-based Declarative Development Paradigm
+    - [Overview](ui-ts-overview.md)
+    - Framework Overview
+        - File Organization
+            - [Directory Structure](ts-framework-directory.md)
+            - [Rules for Accessing Application Code Files](ts-framework-file-access-rules.md)
+        - ["js" Tag](ts-framework-js-tag.md)
+        - Resource Access
+            - [Accessing Application Resources](ts-application-resource-access.md)
+            - [Accessing System Resources](ts-system-resource-access.md)
+            - [Media Resource Types](ts-media-resource-type.md)
+        - [Pixel Units](ts-pixel-units.md)
+        - [Types](ts-types.md)
+    - Declarative Syntax
+        - [Overview](ts-syntax-intro.md)
+        - General UI Description Specifications
+            - [Basic Concepts](ts-general-ui-concepts.md)
+            - Declarative UI Description Specifications
+                - [Configuration Without Parameters](ts-parameterless-configuration.md)
+                - [Configuration with Mandatory Parameters](ts-configuration-with-mandatory-parameters.md)
+                - [Attribute Configuration](ts-attribution-configuration.md)
+                - [Event Configuration](ts-event-configuration.md)
+                - [Child Component Configuration](ts-child-component-configuration.md)
+            - Componentization
+                - [@Component](ts-component-based-component.md)
+                - [@Entry](ts-component-based-entry.md)
+                - [@Preview](ts-component-based-preview.md)
+                - [@Builder](ts-component-based-builder.md)
+                - [@Extend](ts-component-based-extend.md)
+                - [@CustomDialog](ts-component-based-customdialog.md)
+                - [@Styles](ts-component-based-styles.md)
+        - About UI State Management
+            - [Basic Concepts](ts-ui-state-mgmt-concepts.md)
+            - Managing Component States
+                - [@State](ts-component-states-state.md)
+                - [@Prop](ts-component-states-prop.md)
+                - [@Link](ts-component-states-link.md)
+            - Managing Application States
+                - [AppStorage](ts-application-states-appstorage.md)
+                - [PersistentStorage](ts-application-states-apis-persistentstorage.md)
+                - [Environment](ts-application-states-apis-environment.md)
+            - Managing Other States
+                - [@Observed and @ObjectLink](ts-other-states-observed-objectlink.md)
+                - [@Consume and @Provide](ts-other-states-consume-provide.md)
+                - [@Watch](ts-other-states-watch.md)
+            - About Rendering Control Syntax
+                - [if/else](ts-rending-control-syntax-if-else.md)
+                - [ForEach](ts-rending-control-syntax-foreach.md)
+                - [LazyForEach](ts-rending-control-syntax-lazyforeach.md)
+        - About @Component
+            - [build Function](ts-function-build.md)
+            - [Initialization of Custom Components' Member Variables](ts-custom-component-initialization.md)
+            - [Custom Component Lifecycle Callbacks](ts-custom-component-lifecycle-callbacks.md)
+            - [Component Creation and Re-initialization](ts-component-creation-re-initialization.md)
+        - [About Syntactic Sugar](ts-syntactic-sugar.md)
+    - Common Component Development Guidelines
+        - [Button](ui-ts-basic-components-button.md)
+        - [Web](ui-ts-components-web.md)
+    - Common Layout Development Guidelines
+        - [Flex Layout](ui-ts-layout-flex.md)
+        - [Grid Layout](ui-ts-layout-grid-container.md)
+        - [Media Query](ui-ts-layout-mediaquery.md)
+    - Experiencing the Declarative UI
+        - [Creating a Declarative UI Project](ui-ts-creating-project.md)
+        - [Getting to Know Components](ui-ts-components.md)
+        - [Creating a Simple Page](ui-ts-creating-simple-page.md)
+    - Defining Page Layout and Connection
+        - [Building a Food Data Model](ui-ts-building-data-model.md)
+        - [Building a Food Category List Layout](ui-ts-building-category-list-layout.md)
+        - [Building a Food Category Grid Layout](ui-ts-building-category-grid-layout.md)
+        - [Implementing Page Redirection and Data Transmission](ui-ts-page-redirection-data-transmission.md)
 - JavaScript-based Web-like Development Paradigm
    - [Overview](ui-js-overview.md)
    - Framework
@@ -73,74 +144,4 @@
                - [Animation Effect](ui-js-animate-dynamic-effects.md)
                - [Animation Frame](ui-js-animate-frame.md)
    - [Custom Components](ui-js-custom-components.md)
- TypeScript-based Declarative Development Paradigm
-    - [Overview](ui-ts-overview.md)
-    - Framework Overview
-        - File Organization
-            - [Directory Structure](ts-framework-directory.md)
-            - [Rules for Accessing Application Code Files](ts-framework-file-access-rules.md)
-        - ["js" Tag](ts-framework-js-tag.md)
-        - Resource Access
-            - [Accessing Application Resources](ts-application-resource-access.md)
-            - [Accessing System Resources](ts-system-resource-access.md)
-            - [Media Resource Types](ts-media-resource-type.md)
-        - [Pixel Units](ts-pixel-units.md)
-        - [Types](ts-types.md)
-    - Declarative Syntax
-        - [Overview](ts-syntax-intro.md)
-        - General UI Description Specifications
-            - [Basic Concepts](ts-general-ui-concepts.md)
-            - Declarative UI Description Specifications
-                - [Configuration Without Parameters](ts-parameterless-configuration.md)
-                - [Configuration with Mandatory Parameters](ts-configuration-with-mandatory-parameters.md)
-                - [Attribute Configuration](ts-attribution-configuration.md)
-                - [Event Configuration](ts-event-configuration.md)
-                - [Child Component Configuration](ts-child-component-configuration.md)
-            - Componentization
-                - [@Component](ts-component-based-component.md)
-                - [@Entry](ts-component-based-entry.md)
-                - [@Preview](ts-component-based-preview.md)
-                - [@Builder](ts-component-based-builder.md)
-                - [@Extend](ts-component-based-extend.md)
-                - [@CustomDialog](ts-component-based-customdialog.md)
-                - [@Styles](ts-component-based-styles.md)
-        - About UI State Management
-            - [Basic Concepts](ts-ui-state-mgmt-concepts.md)
-            - Managing Component States
-                - [@State](ts-component-states-state.md)
-                - [@Prop](ts-component-states-prop.md)
-                - [@Link](ts-component-states-link.md)
-            - Managing Application States
-                - [AppStorage](ts-application-states-appstorage.md)
-                - [PersistentStorage](ts-application-states-apis-persistentstorage.md)
-                - [Environment](ts-application-states-apis-environment.md)
-            - Managing Other States
-                - [@Observed and @ObjectLink](ts-other-states-observed-objectlink.md)
-                - [@Consume and @Provide](ts-other-states-consume-provide.md)
-                - [@Watch](ts-other-states-watch.md)
-            - About Rendering Control Syntax
-                - [if/else](ts-rending-control-syntax-if-else.md)
-                - [ForEach](ts-rending-control-syntax-foreach.md)
-                - [LazyForEach](ts-rending-control-syntax-lazyforeach.md)
-        - About @Component
-            - [build Function](ts-function-build.md)
-            - [Initialization of Custom Components' Member Variables](ts-custom-component-initialization.md)
-            - [Custom Component Lifecycle Callbacks](ts-custom-component-lifecycle-callbacks.md)
-            - [Component Creation and Re-initialization](ts-component-creation-re-initialization.md)
-        - [About Syntactic Sugar](ts-syntactic-sugar.md)
-    - Common Component Development Guidelines
-        - [Button](ui-ts-basic-components-button.md)
-        - [Web](ui-ts-components-web.md)
-    - Common Layout Development Guidelines
-        - [Flex Layout](ui-ts-layout-flex.md)
-        - [Grid Layout](ui-ts-layout-grid-container.md)
-        - [Media Query](ui-ts-layout-mediaquery.md)
-    - Experiencing the Declarative UI
-        - [Creating a Declarative UI Project](ui-ts-creating-project.md)
-        - [Getting to Know Components](ui-ts-components.md)
-        - [Creating a Simple Page](ui-ts-creating-simple-page.md)
-    - Defining Page Layout and Connection
-        - [Building a Food Data Model](ui-ts-building-data-model.md)
-        - [Building a Food Category List Layout](ui-ts-building-category-list-layout.md)
-        - [Building a Food Category Grid Layout](ui-ts-building-category-grid-layout.md)
-        - [Implementing Page Redirection and Data Transmission](ui-ts-page-redirection-data-transmission.md)
+
--- a/en/application-dev/website.md
+++ b/en/application-dev/website.md
--- a/zh-cn/application-dev/Readme-CN.md
+++ b/zh-cn/application-dev/Readme-CN.md
@@ -42,8 +42,8 @@
    - [示例代码](https://gitee.com/openharmony/app_samples/blob/master/README_zh.md)
    - [Codelabs](https://gitee.com/openharmony/codelabs/blob/master/README.md)
 - API参考
-    - [组件参考（基于JS扩展的类Web开发范式）](reference/arkui-js/Readme-CN.md)
    - [组件参考（基于TS扩展的声明式开发范式）](reference/arkui-ts/Readme-CN.md)
+    - [组件参考（基于JS扩展的类Web开发范式）](reference/arkui-js/Readme-CN.md)
    - 接口
      -   [JS及TS API参考](reference/apis/Readme-CN.md)
      -   Native API

--- a/zh-cn/application-dev/application-dev-guide-for-gitee.md
+++ b/zh-cn/application-dev/application-dev-guide-for-gitee.md
@@ -54,8 +54,11 @@ DevEco Studio工具是OpenHarmony应用开发的推荐IDE工具。
 API参考提供了OpenHarmony全量组件和接口的参考文档，可以帮助开发者快速查找到指定接口的详细描述和调用方法。

 内容包括：
- [组件参考（基于JS扩展的类Web开发范式）](reference/arkui-js/Readme-CN.md)
+
 - [组件参考（基于TS扩展的声明式开发范式）](reference/arkui-ts/Readme-CN.md)
+
+
+- [组件参考（基于JS扩展的类Web开发范式）](reference/arkui-js/Readme-CN.md)
 - 接口参考
    - [JS及TS API参考](reference/apis/Readme-CN.md)
    - Native API

--- a/zh-cn/application-dev/reference/Readme-CN.md
+++ b/zh-cn/application-dev/reference/Readme-CN.md
 # 开发参考

-   [组件参考（基于JS扩展的类Web开发范式）](arkui-js/Readme-CN.md)
 -   [组件参考（基于TS扩展的声明式开发范式）](arkui-ts/Readme-CN.md)
+-   [组件参考（基于JS扩展的类Web开发范式）](arkui-js/Readme-CN.md)
 -   [接口参考（JS及TS API）](apis/Readme-CN.md)
 -   接口参考（Native API）
    -   [OpenHarmony Native API](./native-apis/Readme-CN.md)

--- a/zh-cn/application-dev/ui/Readme-CN.md
+++ b/zh-cn/application-dev/ui/Readme-CN.md
 # UI开发

 - [方舟开发框架（ArkUI）概述](arkui-overview.md)
+- 基于TS扩展的声明式开发范式
+    - [概述](ui-ts-overview.md)
+    - 框架说明
+        - 文件组织
+            - [目录结构](ts-framework-directory.md)
+            - [应用代码文件访问规则](ts-framework-file-access-rules.md)
+        - [js标签配置](ts-framework-js-tag.md)
+        - 资源管理
+            - [资源文件的分类](ui-ts-basic-resource-file-categories.md)
+            - [资源访问](ts-resource-access.md)
+        - [像素单位](ts-pixel-units.md)
+        - [类型定义](ts-types.md)
+    - 声明式语法
+        - [描述规范使用说明](ts-syntax-intro.md)
+        - 通用UI描述规范
+            - [基本概念](ts-general-ui-concepts.md)
+            - 声明式UI描述规范
+                - [无构造参数配置](ts-parameterless-configuration.md)
+                - [必选参数构造配置](ts-configuration-with-mandatory-parameters.md)
+                - [属性配置](ts-attribution-configuration.md)
+                - [事件配置](ts-event-configuration.md)
+                - [子组件配置](ts-child-component-configuration.md)
+            - 组件化
+                - [@Component](ts-component-based-component.md)
+                - [@Entry](ts-component-based-entry.md)
+                - [@Preview](ts-component-based-preview.md)
+                - [@Builder](ts-component-based-builder.md)
+                - [@Extend](ts-component-based-extend.md)
+                - [@CustomDialog](ts-component-based-customdialog.md)
+                - [@Styles](ts-component-based-styles.md)
+        - UI状态管理
+            - [基本概念](ts-ui-state-mgmt-concepts.md)
+            - 管理组件拥有的状态
+                - [@State](ts-component-states-state.md)
+                - [@Prop](ts-component-states-prop.md)
+                - [@Link](ts-component-states-link.md)
+            - 管理应用程序的状态
+                - [应用程序的数据存储](ts-application-states-appstorage.md)
+                - [Ability数据存储](ui-ts-local-storage.md)
+                - [持久化数据管理](ts-application-states-apis-persistentstorage.md)
+                - [环境变量](ts-application-states-apis-environment.md)
+            - 其他类目的状态管理
+                - [Observed和ObjectLink数据管理](ts-other-states-observed-objectlink.md)
+                - [@Consume和@Provide数据管理](ts-other-states-consume-provide.md)
+                - [@Watch](ts-other-states-watch.md)
+        - 渲染控制语法
+            - [条件渲染](ts-rending-control-syntax-if-else.md)
+            - [循环渲染](ts-rending-control-syntax-foreach.md)
+            - [数据懒加载](ts-rending-control-syntax-lazyforeach.md)
+        - 深入理解组件化
+            - [build函数](ts-function-build.md)
+            - [自定义组件初始化](ts-custom-component-initialization.md)
+            - [自定义组件生命周期回调函数](ts-custom-component-lifecycle-callbacks.md)
+            - [组件创建和重新初始化示例](ts-component-creation-re-initialization.md)
+        - [语法糖](ts-syntactic-sugar.md)
+    - 常见组件开发指导
+        - [Button开发指导](ui-ts-basic-components-button.md)
+        - [Web开发指导](ui-ts-components-web.md)
+    - 常见布局开发指导
+        - [弹性布局](ui-ts-layout-flex.md)
+        - [栅格布局](ui-ts-layout-grid-container.md)
+        - [媒体查询](ui-ts-layout-mediaquery.md)
+    - 体验声明式UI
+        - [创建声明式UI工程](ui-ts-creating-project.md)
+        - [初识Component](ui-ts-components.md)
+        - [创建简单视图](ui-ts-creating-simple-page.md)
+    - 页面布局与连接
+        - [构建食物数据模型](ui-ts-building-data-model.md)
+        - [构建食物列表List布局](ui-ts-building-category-list-layout.md)
+        - [构建食物分类Grid布局](ui-ts-building-category-grid-layout.md)
+        - [页面跳转与数据传递](ui-ts-page-redirection-data-transmission.md)
+
 - 基于JS扩展的类Web开发范式
    - [概述](ui-js-overview.md)
    - 框架说明
@@ -73,74 +145,3 @@
                - [动画动效](ui-js-animate-dynamic-effects.md)
                - [动画帧](ui-js-animate-frame.md)
    - [自定义组件](ui-js-custom-components.md)
\ No newline at end of file
- 基于TS扩展的声明式开发范式
-    - [概述](ui-ts-overview.md)
-    - 框架说明
-        - 文件组织
-            - [目录结构](ts-framework-directory.md)
-            - [应用代码文件访问规则](ts-framework-file-access-rules.md)
-        - [js标签配置](ts-framework-js-tag.md)
-        - 资源管理
-            - [资源文件的分类](ui-ts-basic-resource-file-categories.md)
-            - [资源访问](ts-resource-access.md)
-        - [像素单位](ts-pixel-units.md)
-        - [类型定义](ts-types.md)
-    - 声明式语法
-        - [描述规范使用说明](ts-syntax-intro.md)
-        - 通用UI描述规范
-            - [基本概念](ts-general-ui-concepts.md)
-            - 声明式UI描述规范
-                - [无构造参数配置](ts-parameterless-configuration.md)
-                - [必选参数构造配置](ts-configuration-with-mandatory-parameters.md)
-                - [属性配置](ts-attribution-configuration.md)
-                - [事件配置](ts-event-configuration.md)
-                - [子组件配置](ts-child-component-configuration.md)
-            - 组件化
-                - [@Component](ts-component-based-component.md)
-                - [@Entry](ts-component-based-entry.md)
-                - [@Preview](ts-component-based-preview.md)
-                - [@Builder](ts-component-based-builder.md)
-                - [@Extend](ts-component-based-extend.md)
-                - [@CustomDialog](ts-component-based-customdialog.md)
-                - [@Styles](ts-component-based-styles.md)
-        - UI状态管理
-            - [基本概念](ts-ui-state-mgmt-concepts.md)
-            - 管理组件拥有的状态
-                - [@State](ts-component-states-state.md)
-                - [@Prop](ts-component-states-prop.md)
-                - [@Link](ts-component-states-link.md)
-            - 管理应用程序的状态
-                - [应用程序的数据存储](ts-application-states-appstorage.md)
-                - [Ability数据存储](ui-ts-local-storage.md)
-                - [持久化数据管理](ts-application-states-apis-persistentstorage.md)
-                - [环境变量](ts-application-states-apis-environment.md)
-            - 其他类目的状态管理
-                - [Observed和ObjectLink数据管理](ts-other-states-observed-objectlink.md)
-                - [@Consume和@Provide数据管理](ts-other-states-consume-provide.md)
-                - [@Watch](ts-other-states-watch.md)
-        - 渲染控制语法
-            - [条件渲染](ts-rending-control-syntax-if-else.md)
-            - [循环渲染](ts-rending-control-syntax-foreach.md)
-            - [数据懒加载](ts-rending-control-syntax-lazyforeach.md)
-        - 深入理解组件化
-            - [build函数](ts-function-build.md)
-            - [自定义组件初始化](ts-custom-component-initialization.md)
-            - [自定义组件生命周期回调函数](ts-custom-component-lifecycle-callbacks.md)
-            - [组件创建和重新初始化示例](ts-component-creation-re-initialization.md)
-        - [语法糖](ts-syntactic-sugar.md)
-    - 常见组件开发指导
-        - [Button开发指导](ui-ts-basic-components-button.md)
-        - [Web开发指导](ui-ts-components-web.md)
-    - 常见布局开发指导
-        - [弹性布局](ui-ts-layout-flex.md)
-        - [栅格布局](ui-ts-layout-grid-container.md)
-        - [媒体查询](ui-ts-layout-mediaquery.md)
-    - 体验声明式UI
-        - [创建声明式UI工程](ui-ts-creating-project.md)
-        - [初识Component](ui-ts-components.md)
-        - [创建简单视图](ui-ts-creating-simple-page.md)
-    - 页面布局与连接
-        - [构建食物数据模型](ui-ts-building-data-model.md)
-        - [构建食物列表List布局](ui-ts-building-category-list-layout.md)
-        - [构建食物分类Grid布局](ui-ts-building-category-grid-layout.md)
-        - [页面跳转与数据传递](ui-ts-page-redirection-data-transmission.md)
--- a/zh-cn/application-dev/ui/arkui-overview.md
+++ b/zh-cn/application-dev/ui/arkui-overview.md
@@ -26,12 +26,12 @@

 - 平台API通道：方舟开发框架提供了API扩展机制，平台能力通过此种机制进行封装，提供风格统一的JS接口。

- 两种开发范式：方舟开发框架针对不同目的和技术背景的开发者提供了两种开发范式，分别是基于JS扩展的类Web开发范式（简称“类Web开发范式”）和基于TS扩展的声明式开发范式（简称“声明式开发范式”）。
+- 两种开发范式：方舟开发框架针对不同目的和技术背景的开发者提供了两种开发范式，分别是基于TS扩展的声明式开发范式（简称“声明式开发范式”）和基于JS扩展的类Web开发范式（简称“类Web开发范式”）。

  | 开发范式名称   | 简介                                       | 适用场景             | 适用人群                |
  | -------- | ---------------------------------------- | ---------------- | ------------------- |
-  | 类Web开发范式 | 采用经典的HML、CSS、JavaScript三段式开发方式。使用HML标签文件进行布局搭建，使用CSS文件进行样式描述，使用JavaScript文件进行逻辑处理。UI组件与数据之间通过单向数据绑定的方式建立关联，当数据发生变化时，UI界面自动触发更新。此种开发方式，更接近Web前端开发者的使用习惯，快速将已有的Web应用改造成方舟开发框架应用。 | 界面较为简单的中小型应用和卡片  | Web前端开发人员           |
  | 声明式开发范式  | 采用TS语言并进行声明式UI语法扩展，从组件、动效和状态管理三个维度提供了UI绘制能力。UI开发更接近自然语义的编程方式，让开发者直观地描述UI界面，不必关心框架如何实现UI绘制和渲染，实现极简高效开发。同时，选用有类型标注的TS语言，引入编译期的类型校验。 | 复杂度较大、团队合作度较高的程序 | 移动系统应用开发人员、系统应用开发人员 |
+  | 类Web开发范式 | 采用经典的HML、CSS、JavaScript三段式开发方式。使用HML标签文件进行布局搭建，使用CSS文件进行样式描述，使用JavaScript文件进行逻辑处理。UI组件与数据之间通过单向数据绑定的方式建立关联，当数据发生变化时，UI界面自动触发更新。此种开发方式，更接近Web前端开发者的使用习惯，快速将已有的Web应用改造成方舟开发框架应用。 | 界面较为简单的中小型应用和卡片  | Web前端开发人员           |




--- a/zh-cn/application-dev/website.md
+++ b/zh-cn/application-dev/website.md