Merge pull request #311 from vuejs/docs-provide-inject

update: translate provide/inject

Author: Jinjiang

src/api/application-api.md

@@ -223,11 +223,11 @@ app.mount('#my-app')
 
 - **用法：**
 
-  设置一个可以被注入到应用范围内所有组件中的值。组件应该使用 `inject` 来接收提供的值。
+  设置一个可以被注入到应用范围内所有组件中的值。组件应该使用 `inject` 来接收 provide 的值。
 
   从 `provide`/`inject` 的角度来看，可以将应用程序视为根级别的祖先，而根组件是其唯一的子级。
 
-  该方法不应该与 [provide 组件选项](options-composition.html#provide-inject)或组合式 API 中的 [provide 方法](composition-api.html#provide-inject)混淆。虽然它们也是相同的 `provide`/`inject` 机制的一部分，但是是用来配置组件提供的值而不是应用提供的值。
+  该方法不应该与 [provide 组件选项](options-composition.html#provide-inject)或组合式 API 中的 [provide 方法](composition-api.html#provide-inject)混淆。虽然它们也是相同的 `provide`/`inject` 机制的一部分，但是是用来配置组件 provide 的值而不是应用 provide 的值。
 
   通过应用提供值在写插件时尤其有用，因为插件一般不能使用组件提供值。这是使用 [globalProperties](application-config.html#globalProperties) 的替代选择。
 

src/api/composition-api.md

@@ -145,7 +145,7 @@ function inject<T>(
 ): T
 ```
 
-Vue 提供了一个 `InjectionKey` 接口，该接口是扩展 `Symbol` 的泛型类型。它可用于在提供者和消费者之间同步注入值的类型：
+Vue 提供了一个 `InjectionKey` 接口，该接口是扩展 `Symbol` 的泛型类型。它可用于在提供者和消费者之间同步 inject 值的类型：
 
 ```ts
 import { InjectionKey, provide, inject } from 'vue'
@@ -157,7 +157,7 @@ provide(key, 'foo') // 提供非字符串值将导致错误
 const foo = inject(key) // foo 的类型: string | undefined
 ```
 
-如果使用字符串 key 或非类型化 symbols，则需要显式声明注入值的类型：
+如果使用字符串 key 或非类型化 symbols，则需要显式声明 inject 值的类型：
 
 ```ts
 const foo = inject<string>('foo') // string | undefined

src/api/options-composition.md

@@ -71,7 +71,7 @@
 
   - 一个字符串数组，或
   - 一个对象，对象的 key 是本地的绑定名，value 是：
-    - 在可用的注入内容中搜索用的 key (字符串或 Symbol)，或
+    - 在可用注入内容中搜索用的 key (字符串或 Symbol)，或
     - 一个对象，该对象的：
       - `from` property 是在可用的注入内容中搜索用的 key (字符串或 Symbol)
       - `default` property 是降级情况下使用的 value
@@ -81,15 +81,15 @@
 - **示例：**
 
   ```js
-  // 父级组件提供 'foo'
+  // 父级组件 provide  'foo'
   const Provider = {
     provide: {
       foo: 'bar'
     }
     // ...
   }
 
-  // 子组件注入 'foo'
+  // 子组件 inject  'foo'
   const Child = {
     inject: ['foo'],
     created() {
@@ -118,7 +118,7 @@
   }
   ```
 
-  使用一个注入的值作为一个 property 的默认值：
+  使用一个 inject 的值作为一个 property 的默认值：
 
   ```js
   const Child = {
@@ -133,7 +133,7 @@
   }
   ```
 
-  使用一个注入的值作为数据入口：
+  使用一个 inject 的值作为数据入口：
 
   ```js
   const Child = {
@@ -146,7 +146,7 @@
   }
   ```
 
-  注入可以通过设置默认值使其变成可选项：
+  Inject 可以通过设置默认值使其变成可选项：
 
   ```js
   const Child = {

src/guide/component-provide-inject.md

@@ -1,10 +1,10 @@
-# 提供 / 注入
+# Provide / Inject
 
 > 该页面假设你已经阅读过了[组件基础](component-basics.md)。如果你还对组件不太了解，推荐你先阅读它。
 
 通常，当我们需要将数据从父组件传递到子组件时，我们使用 [props](component-props.md)。想象一下这样的结构：你有一些深嵌套的组件，而你只需要来自深嵌套子组件中父组件的某些内容。在这种情况下，你仍然需要将 prop 传递到整个组件链中，这可能会很烦人。
 
-对于这种情况，我们可以使用 `provide` 和 `inject` 对。父组件可以作为其所有子组件的依赖项提供程序，而不管组件层次结构有多深。这个特性有两个部分：父组件有一个 `provide` 选项来提供数据，子组件有一个 `inject` 选项来开始使用这个数据。
+对于这种情况，我们可以使用一对 `provide` 和 `inject`。父组件可以作为其所有子组件的依赖项提供函数，而不管组件层次结构有多深。这个特性有两个部分：父组件有一个 `provide` 选项来提供数据，子组件有一个 `inject` 选项来开始使用这个数据。
 
 ![Provide/inject scheme](/images/components_provide.png)
 
@@ -49,7 +49,7 @@ app.component('todo-list-statistics', {
 })
 ```
 
-但是，如果我们尝试在此处提供一些组件实例 property，则这将不起作用：
+但是，如果我们尝试在此处 provide 一些组件实例 property，则这将不起作用：
 
 ```js
 app.component('todo-list', {
@@ -59,7 +59,7 @@ app.component('todo-list', {
     }
   },
   provide: {
-    todoLength: this.todos.length // 将会导致错误 'Cannot read property 'length' of undefined`
+    todoLength: this.todos.length // 将会导致错误 `Cannot read property 'length' of undefined`
   },
   template: `
     ...
@@ -91,12 +91,12 @@ app.component('todo-list', {
 
 实际上，你可以将依赖注入看作是“long range props”，除了：
 
-- 父组件不需要知道哪些子组件使用它提供的 property
+- 父组件不需要知道哪些子组件使用它 provide 的 property
 - 子组件不需要知道 `inject` property 来自哪里
 
 ## 处理响应性
 
-在上面的例子中，如果我们更改了 `todos` 的列表，这个更改将不会反映在注入的 `todoLength` property 中。这是因为默认情况下，`provide/inject` 绑定*不*是被动绑定。我们可以通过将 `ref` property 或 `reactive` 对象传递给 `provide` 来更改此行为。在我们的例子中，如果我们想对祖先组件中的更改做出反应，我们需要为我们提供的 `todoLength` 分配一个组合式 API `computed` property：
+在上面的例子中，如果我们更改了 `todos` 的列表，这个更改将不会反映在 inject 的 `todoLength` property 中。这是因为默认情况下，`provide/inject` 绑定*不*是被动绑定。我们可以通过将 `ref` property 或 `reactive` 对象传递给 `provide` 来更改此行为。在我们的例子中，如果我们想对祖先组件中的更改做出反应，我们需要为我们 provide 的 `todoLength` 分配一个组合式 API `computed` property：
 
 ```js
 app.component('todo-list', {

src/guide/component-slots.md

@@ -114,7 +114,7 @@ Vue 实现了一套内容分发的 API，这套 API 的设计灵感源自 [Web C
 </button>
 ```
 
-现在当我在一个父级组件中使用 `<submit-button` > 并且不提供任何插槽内容时：
+现在当我们在一个父级组件中使用 `<submit-button` > 并且不提供任何插槽内容时：
 
 ```html
 <submit-button></submit-button>

src/guide/composition-api-provide-inject.md

@@ -1,4 +1,4 @@
-# 提供/注入
+# Provide / Inject
 
 > 本指南假定你已经阅读了 [Provide / Inject](component-provide-inject.html)、[组合式 API 介绍](composition-api-introduction.html)和[响应性基础](reactivity-fundamentals.html)。如果你不熟悉组合式 API，请先阅读这篇文章。
 
@@ -45,12 +45,12 @@ export default {
 
 在 `setup()` 中使用 `provide` 时，我们首先从 `vue` 显式导入 `provide` 方法。这使我们能够调用 `provide` 时来定义每个 property。
 
- `provide` 函数允许你通过两个参数定义 property：
+`provide` 函数允许你通过两个参数定义 property：
 
 1. property 的 name (`<String>` 类型)
 2. property 的 value
 
-使用 `MyMap` 组件，我们提供的值可以按如下方式重构：
+使用 `MyMap` 组件，我们 provide 的值可以按如下方式重构：
 
 ```vue{7,14-20}
 <!-- src/components/MyMap.vue -->
@@ -77,13 +77,13 @@ export default {
 </script>
 ```
 
-## 使用注入
+## 使用 inject
 
 在 `setup()` 中使用 `inject` 时，还需要从 `vue` 显式导入它。一旦我们这样做了，我们就可以调用它来定义如何将它暴露给我们的组件。
 
 `inject` 函数有两个参数：
 
-1. 要注入的 property 的名称
+1. 要 inject 的 property 的名称
 2. 一个默认的值 (**可选**)
 
 使用 `MyMarker` 组件，可以使用以下代码对其进行重构：
@@ -111,7 +111,7 @@ export default {
 
 ### 添加响应性
 
-为了增加提供值和注入值之间的响应性，我们可以在提供值时使用 [ref](reactivity-fundamentals.html#创建独立的响应式值作为-refs) 或 [reactive](reactivity-fundamentals.html#声明响应式状态)。
+为了增加 provide 值和 inject 值之间的响应性，我们可以在 provide 值时使用 [ref](reactivity-fundamentals.html#创建独立的响应式值作为-refs) 或 [reactive](reactivity-fundamentals.html#声明响应式状态)。
 
 使用 `MyMap` 组件，我们的代码可以更新如下：
 
@@ -147,7 +147,7 @@ export default {
 
 ### 修改响应式 property
 
-当使用响应式提供/注入值时，**建议尽可能，在*提供者*内保持响应式 property 的任何更改**。
+当使用响应式 provide / inject 值时，**建议尽可能，在*提供者*内保持响应式 property 的任何更改**。
 
 例如，在需要更改用户位置的情况下，我们最好在 `MyMap` 组件中执行此操作。
 
@@ -188,7 +188,7 @@ export default {
 </script>
 ```
 
-然而，有时我们需要在注入数据的组件内部更新注入的数据。在这种情况下，我们建议提供一个方法来负责改变响应式 property。
+然而，有时我们需要在注入数据的组件内部更新 inject 的数据。在这种情况下，我们建议 provide 一个方法来负责改变响应式 property。
 
 ``` vue{21-23,27}
 <!-- src/components/MyMap.vue -->
@@ -244,7 +244,7 @@ export default {
 </script>
 ```
 
-最后，如果要确保通过 `provide` 传递的数据不会被注入的组件更改，我们建议对提供者的 property 使用 `readonly`。
+最后，如果要确保通过 `provide` 传递的数据不会被 inject 的组件更改，我们建议对提供者的 property 使用 `readonly`。
 
 ```vue{7,25-26}
 <!-- src/components/MyMap.vue -->

src/guide/migration/global-api.md

@@ -177,7 +177,7 @@ app.directive('focus', {
 app.mount('#app')
 ```
 
-## 提供/注入 (Provide / Inject)
+## Provide / Inject
 
 与在 2.x 根实例中使用 `provide` 选项类似，Vue 3 应用实例还可以提供可由应用内的任何组件注入的依赖项：
 
@@ -196,9 +196,7 @@ export default {
 }
 ```
 
-<!-- TODO: translation -->
-
-Using `provide` is especially useful when writing a plugin, as an alternative to `globalProperties`. 
+使用 `provide` 在编写插件时非常有用，可以替代 `globalProperties`。
 
 ## 在应用之间共享配置
 

src/guide/migration/props-default-this.md

@@ -12,7 +12,7 @@ badges:
 
 - 把组件接收到的原始 prop 作为参数传递给默认函数；
 
-- [注入](../composition-api-provide-inject.md) API 可以在默认函数中使用。
+- [inject](../composition-api-provide-inject.md) API 可以在默认函数中使用。
 
 ```js
 import { inject } from 'vue'