Merge branch 'feature/alova@3.x' of https://github.com/alovajs/alovaj…

…s.github.io

docs/tutorial/02-getting-started/01-introduce.md

@@ -71,17 +71,20 @@ const {
 
 alova provides 15+ request strategy modules based on the [RSM](/about/RSM) specification, which are implemented in the form of useHook.
 
-### Alova editor extension
+### Editor extension
 
-Using the alova extension in vscode can help you automatically generate request codes with complete API document annotations and response types. Whether it is a ts project or a js project, you can get complete interface queries, interface details, and smart prompts for response data types.
+Using the alova extension in vscode can automatically generate three pieces of API information for you at the same time. They are API request code, corresponding request parameters and response types, and complete documentation for the corresponding API. Whether it is a ts project or a js project, you can get complete API intelliSense of editor. In addition, you can quickly view API documentation in the editor.
 
-This extension also optimizes the API usage process, allowing you to experience a different API integration experience. In the past, you needed to query the API documentation first, and constantly switch between the API documentation and the editor to write request code. After using the alova plug-in, you no longer need to leave the editor and can directly use the API in the editor while checking.
-
-import vscodeDemoVideo from '@site/static/video/vscode-demo-video-en.mp4';
+```mermaid
+flowchart LR
+R1[OpenAPI file] --> S1[Alova Extension] --> W1[API functions]
+S1[Alova Extension] --> W2[complete API types]
+S1[Alova Extension] --> W3[complete API documentation]
+```
 
-<video width="100%" controls controlsList="nodownload" src={vscodeDemoVideo} />
+This extension has also optimized the API process, giving you a different API integration experience. In the past, you needed to query the API documentation first and constantly switch between the API documentation and your editor to write the request code. After using the alova extension, you no longer need to leave the editor. You can directly insert the API in the editor by API path or description keyword, and automatically complete the required request parameters.
 
-> For a detailed introduction to the alova plug-in, please refer to [Integrated Editor Extension](/tutorial/getting-started/extension-integration).
+> For detailed introduction to the alova extension, please refer to [Integrated Editor Extension](/tutorial/getting-started/extension-integration).
 
 ## Is there any difference?
 

i18n/zh-CN/docusaurus-plugin-content-docs/current/tutorial/02-getting-started/01-introduce.md

@@ -70,17 +70,20 @@ const {
 
 alova 提供了 15+个基于[RSM](/about/RSM)规范的请求策略模块，它们以 useHook 或 function 的形式实现。
 
-### alova 编辑器扩展
+### 编辑器扩展
 
-在 vscode 中使用 alova 扩展可以帮你自动生成包含完整的 API 文档标注，响应类型的请求代码，无论是 ts 项目还是 js 项目，你都可以获得完整的接口查询、接口详细信息，以及响应数据类型的智能提示。
+在 vscode 中使用 alova 扩展可以同时为你自动生成三项 API 信息，分别是 API 请求代码、对应的请求参数和响应数据类型、对应 API 的完整文档信息，无论是 ts 项目还是 js 项目，你都可以在编辑器中获得完整的 API 类型的智能提示，此外，还能在编辑器中快速查看 API 文档。
 
-这个扩展也优化了 API 的使用流程，让你感受不一样的 API 集成体验，在过去，你需要先查询 API 文档，并不断地在 API 文档与编辑器切换来编写请求代码，使用 alova 插件后，你可以不再需要离开编辑器，直接在编辑器中边查边使用 API。
-
-import vscodeDemoVideo from '@site/static/video/vscode-demo-video-chinese.mp4';
+```mermaid
+flowchart LR
+R1[OpenAPI文件] --> S1[Alova扩展] --> W1[API函数]
+S1[Alova扩展] --> W2[完整的API类型]
+S1[Alova扩展] --> W3[完整的API文档]
+```
 
-<video width="100%" controls controlsList="nodownload" src={vscodeDemoVideo} />
+这个扩展也优化了 API 的使用流程，让你感受不一样的 API 集成体验，在过去，你需要先查询 API 文档，并不断地在 API 文档与编辑器切换来编写请求代码，使用 alova 扩展后，你可以不再需要离开编辑器，直接在编辑器中通过 API 的路径或描述关键字快速插入 API 并自动补全不要的请求参数。
 
-> 关于 alova 插件的详细介绍，请参考 [集成编辑器扩展](/tutorial/getting-started/extension-integration)。
+> 关于 alova 扩展的详细介绍，请参考 [集成编辑器扩展](/tutorial/getting-started/extension-integration)。
 
 ## 有什么不同吗？