From 19a426ab7c7f1ad1a39d6b5030c2591012947783 Mon Sep 17 00:00:00 2001
From: heappynd <heappynd@163.com>
Date: Tue, 10 Sep 2024 23:06:29 +0800
Subject: [PATCH 1/2] docs: translate composition-api-helpers

---
 src/api/composition-api-helpers.md | 53 +++++++++++++++---------------
 1 file changed, 26 insertions(+), 27 deletions(-)

diff --git a/src/api/composition-api-helpers.md b/src/api/composition-api-helpers.md
index 6d127d59c..4d4f0ac0b 100644
--- a/src/api/composition-api-helpers.md
+++ b/src/api/composition-api-helpers.md
@@ -1,11 +1,10 @@
-<!-- TODO: translation -->
-# Composition API: Helpers {#composition-api-helpers}
+# 组合式 API: 辅助 {#composition-api-helpers}
 
 ## useAttrs() {#useattrs}
 
-Returns the `attrs` object from the [Setup Context](/api/composition-api-setup#setup-context), which includes the [fallthrough attributes](/guide/components/attrs#fallthrough-attributes) of the current component. This is intended to be used in `<script setup>` where the setup context object is not available.
+从 [Setup 上下文](/api/composition-api-setup#setup-context) 中返回 `attrs` 对象，该对象包含当前组件的 [透传 Attributes](/guide/components/attrs#fallthrough-attributes)。这通常用于 `<script setup>` 中，当 setup 上下文对象不可用时使用。
 
-- **Type**
+- **类型**
 
   ```ts
   function useAttrs(): Record<string, unknown>
@@ -13,11 +12,11 @@ Returns the `attrs` object from the [Setup Context](/api/composition-api-setup#s
 
 ## useSlots() {#useslots}
 
-Returns the `slots` object from the [Setup Context](/api/composition-api-setup#setup-context), which includes parent passed slots as callable functions that return Virtual DOM nodes. This is intended to be used in `<script setup>` where the setup context object is not available.
+从 [Setup 上下文](/api/composition-api-setup#setup-context) 中返回 `slots` 对象，其中包含父组件传递的插槽，作为可调用函数，这些函数返回虚拟 DOM 节点。这通常用于 `<script setup>` 中，当 setup 上下文对象不可用时使用。
 
-If using TypeScript, [`defineSlots()`](/api/sfc-script-setup#defineslots) should be preferred instead.
+如果使用 TypeScript，建议优先使用 [`defineSlots()`](/api/sfc-script-setup#defineslots)。
 
-- **Type**
+- **类型**
 
   ```ts
   function useSlots(): Record<string, (...args: any[]) => VNode[]>
@@ -25,11 +24,11 @@ If using TypeScript, [`defineSlots()`](/api/sfc-script-setup#defineslots) should
 
 ## useModel() {#usemodel}
 
-This is the underlying helper that powers [`defineModel()`](/api/sfc-script-setup#definemodel). If using `<script setup>`, `defineModel()` should be preferred instead.
+这是 [`defineModel()`](/api/sfc-script-setup#definemodel) 的底层辅助函数。如果使用 `<script setup>`，建议优先使用 `defineModel()`。
 
-- Only available in 3.4+
+- 仅在 3.4+ 版本中可用
 
-- **Type**
+- **类型**
 
   ```ts
   function useModel(
@@ -44,7 +43,7 @@ This is the underlying helper that powers [`defineModel()`](/api/sfc-script-setu
   }
   ```
 
-- **Example**
+- **示例**
 
   ```js
   export default {
@@ -57,21 +56,21 @@ This is the underlying helper that powers [`defineModel()`](/api/sfc-script-setu
   }
   ```
 
-- **Details**
+- **详细信息**
 
-  `useModel()` can be used in non-SFC components, e.g. when using raw `setup()` function. It expects the `props` object as the first argument, and the model name as the second argument. The optional third argument can be used to declare custom getter and setter for the resulting model ref. Note that unlike `defineModel()`, you are responsible for declaring the props and emits yourself.
+  `useModel()` 可以用于非 SFC 组件，例如在使用原始的 `setup()` 函数时。它预期的第一个参数是 `props` 对象，第二个参数是 model 名称。可选的第三个参数可以用来声明自定义的 getter 和 setter，用于生成的 model ref。需要注意的是，与 `defineModel()` 不同，你需要自己声明 props 和 emits。
 
 ## useTemplateRef() <sup class="vt-badge" data-text="3.5+" /> {#usetemplateref}
 
-Returns a shallow ref whose value will be synced with the template element or component with a matching ref attribute.
+返回一个浅层 ref，其值将与模板中的具有匹配 ref 属性的元素或组件同步。
 
-- **Type**
+- **类型**
 
   ```ts
   function useTemplateRef<T>(key: string): Readonly<ShallowRef<T | null>>
   ```
 
-- **Example**
+- **示例**
 
   ```vue
   <script setup>
@@ -89,22 +88,22 @@ Returns a shallow ref whose value will be synced with the template element or co
   </template>
   ```
 
-- **See also**
-  - [Guide - Template Refs](/guide/essentials/template-refs)
-  - [Guide - Typing Template Refs](/guide/typescript/composition-api#typing-template-refs) <sup class="vt-badge ts" />
-  - [Guide - Typing Component Template Refs](/guide/typescript/composition-api#typing-component-template-refs) <sup class="vt-badge ts" />
+- **参考**
+  - [指南 - 模板引用](/guide/essentials/template-refs)
+  - [指南 - 为模板引用标注类型](/guide/typescript/composition-api#typing-template-refs) <sup class="vt-badge ts" />
+  - [指南 - 为组件模板引用标注类型](/guide/typescript/composition-api#typing-component-template-refs) <sup class="vt-badge ts" />
 
 ## useId() <sup class="vt-badge" data-text="3.5+" /> {#useid}
 
-Used to generate unique-per-application IDs for accessibility attributes or form elements.
+用于为无障碍属性或表单元素生成应用级唯一的 ID。
 
-- **Type**
+- **类型**
 
   ```ts
   function useId(): string
   ```
 
-- **Example**
+- **示例**
 
   ```vue
   <script setup>
@@ -121,10 +120,10 @@ Used to generate unique-per-application IDs for accessibility attributes or form
   </template>
   ```
 
-- **Details**
+- **详细信息**
 
-  IDs generated by `useId()` are unique-per-application. It can be used to generate IDs for form elements and accessibility attributes. Multiple calls in the same component will generate different IDs; multiple instances of the same component calling `useId()` will also have different IDs.
+  通过 `useId()` 生成的 ID 是应用级唯一的。它可以用于为表单元素和无障碍属性生成 ID。在同一个组件中多次调用会生成不同的 ID；同一个组件的多个实例调用 `useId()` 也会生成不同的 ID。
 
-  IDs generated by `useId()` are also guaranteed to be stable across the server and client renders, so they can be used in SSR applications without leading to hydration mismatches.
+  `useId()` 生成的 ID 在服务器端和客户端渲染之间是稳定的，因此可以安全地在 SSR 应用中使用，不会导致水合不匹配。
 
-  If you have more than one Vue application instance of the same page, you can avoid ID conflicts by giving each app an ID prefix via [`app.config.idPrefix`](/api/application#app-config-idprefix).
+  如果同一页面上有多个 Vue 应用实例，可以通过 [`app.config.idPrefix`](/api/application#app-config-idprefix) 为每个应用提供一个 ID 前缀，以避免 ID 冲突。

From bf8fa616f2d67c2c5244f1829dd35a49cdd4d5e1 Mon Sep 17 00:00:00 2001
From: GU Yiling <justice360@gmail.com>
Date: Tue, 10 Sep 2024 23:54:34 +0800
Subject: [PATCH 2/2] Apply suggestions from code review

---
 src/api/composition-api-helpers.md | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/api/composition-api-helpers.md b/src/api/composition-api-helpers.md
index 4d4f0ac0b..b9ed35458 100644
--- a/src/api/composition-api-helpers.md
+++ b/src/api/composition-api-helpers.md
@@ -1,8 +1,8 @@
-# 组合式 API: 辅助 {#composition-api-helpers}
+# 组合式 API：辅助 {#composition-api-helpers}
 
 ## useAttrs() {#useattrs}
 
-从 [Setup 上下文](/api/composition-api-setup#setup-context) 中返回 `attrs` 对象，该对象包含当前组件的 [透传 Attributes](/guide/components/attrs#fallthrough-attributes)。这通常用于 `<script setup>` 中，当 setup 上下文对象不可用时使用。
+从 [Setup 上下文](/api/composition-api-setup#setup-context) 中返回 `attrs` 对象，其中包含当前组件的[透传 attributes](/guide/components/attrs#fallthrough-attributes)。这是用于 `<script setup>` 中的，因为在 `<script setup>` 中无法获取 setup 上下文对象的。
 
 - **类型**
 
@@ -12,7 +12,7 @@
 
 ## useSlots() {#useslots}
 
-从 [Setup 上下文](/api/composition-api-setup#setup-context) 中返回 `slots` 对象，其中包含父组件传递的插槽，作为可调用函数，这些函数返回虚拟 DOM 节点。这通常用于 `<script setup>` 中，当 setup 上下文对象不可用时使用。
+从 [Setup 上下文](/api/composition-api-setup#setup-context) 中返回 `slots` 对象，其中包含父组件传递的插槽。这些插槽为可调用的函数，返回虚拟 DOM 节点。这是用于 `<script setup>` 中的，因为在 `<script setup>` 中无法获取 setup 上下文对象的。
 
 如果使用 TypeScript，建议优先使用 [`defineSlots()`](/api/sfc-script-setup#defineslots)。
 
@@ -24,7 +24,7 @@
 
 ## useModel() {#usemodel}
 
-这是 [`defineModel()`](/api/sfc-script-setup#definemodel) 的底层辅助函数。如果使用 `<script setup>`，建议优先使用 `defineModel()`。
+这是驱动 [`defineModel()`](/api/sfc-script-setup#definemodel) 的底层辅助函数。如果使用 `<script setup>`，应当优先使用 `defineModel()`。
 
 - 仅在 3.4+ 版本中可用
 
@@ -58,11 +58,11 @@
 
 - **详细信息**
 
-  `useModel()` 可以用于非 SFC 组件，例如在使用原始的 `setup()` 函数时。它预期的第一个参数是 `props` 对象，第二个参数是 model 名称。可选的第三个参数可以用来声明自定义的 getter 和 setter，用于生成的 model ref。需要注意的是，与 `defineModel()` 不同，你需要自己声明 props 和 emits。
+  `useModel()` 可以用于非 SFC 组件，例如在使用原始的 `setup()` 函数时。它预期的第一个参数是 `props` 对象，第二个参数是 model 名称。可选的第三个参数可以用于为生成的 model ref 声明自定义的 getter 和 setter。请注意，与 `defineModel()` 不同，你需要自己声明 props 和 emits。
 
 ## useTemplateRef() <sup class="vt-badge" data-text="3.5+" /> {#usetemplateref}
 
-返回一个浅层 ref，其值将与模板中的具有匹配 ref 属性的元素或组件同步。
+返回一个浅层 ref，其值将与模板中的具有匹配 ref attribute 的元素或组件同步。
 
 - **类型**
 
@@ -95,7 +95,7 @@
 
 ## useId() <sup class="vt-badge" data-text="3.5+" /> {#useid}
 
-用于为无障碍属性或表单元素生成应用级唯一的 ID。
+用于为无障碍属性或表单元素生成每个应用内唯一的 ID。
 
 - **类型**
 
@@ -122,8 +122,8 @@
 
 - **详细信息**
 
-  通过 `useId()` 生成的 ID 是应用级唯一的。它可以用于为表单元素和无障碍属性生成 ID。在同一个组件中多次调用会生成不同的 ID；同一个组件的多个实例调用 `useId()` 也会生成不同的 ID。
+  `useId()` 生成的每个 ID 在每个应用内都是唯一的。它可以用于为表单元素和无障碍属性生成 ID。在同一个组件中多次调用会生成不同的 ID；同一个组件的多个实例调用 `useId()` 也会生成不同的 ID。
 
-  `useId()` 生成的 ID 在服务器端和客户端渲染之间是稳定的，因此可以安全地在 SSR 应用中使用，不会导致水合不匹配。
+  `useId()` 生成的 ID 在服务器端和客户端渲染之间是稳定的，因此可以安全地在 SSR 应用中使用，不会导致激活不匹配。
 
   如果同一页面上有多个 Vue 应用实例，可以通过 [`app.config.idPrefix`](/api/application#app-config-idprefix) 为每个应用提供一个 ID 前缀，以避免 ID 冲突。