From 39d177971a88e42a08b8a24b0c810bdd701410ec Mon Sep 17 00:00:00 2001 From: Godpu <908662421@qq.com> Date: Sat, 24 Oct 2020 16:03:03 +0800 Subject: [PATCH 1/7] docs: translate reactive --- src/api/basic-reactivity.md | 6 +++--- src/api/options-composition.md | 4 ++-- src/api/refs-api.md | 4 ++-- src/api/special-attributes.md | 2 +- src/guide/component-edge-cases.md | 4 ++-- src/guide/composition-api-introduction.md | 12 ++++++------ src/guide/migration/render-function-api.md | 2 +- src/guide/reactivity-computed-watchers.md | 6 +++--- src/guide/reactivity-fundamentals.md | 2 +- src/style-guide/README.md | 2 +- 10 files changed, 22 insertions(+), 22 deletions(-) diff --git a/src/api/basic-reactivity.md b/src/api/basic-reactivity.md index fe95451c8..d245e1249 100644 --- a/src/api/basic-reactivity.md +++ b/src/api/basic-reactivity.md @@ -10,7 +10,7 @@ const obj = reactive({ count: 0 }) ``` -响应式转换是“深”的——它影响所有嵌套 property。在基于 [ES2015 Proxy](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy) 的实现中，返回的代理是**不**等于原始对象。建议只使用响应式代理，避免依赖原始对象。 +响应式转换是“深层”的——它影响所有嵌套 property。在基于 [ES2015 Proxy](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy) 的实现中，返回的代理是**不**等于原始对象。建议只使用响应式代理，避免依赖原始对象。 **类型声明：** @@ -45,7 +45,7 @@ copy.count++ // 警告! ## `isReactive` -检查对象是否是 [`reactive`](#reactive)创建的响应式代理 +检查对象是否是 [`reactive`](#reactive)创建的响应式 Proxy。 ```js import { reactive, isReactive } from 'vue' @@ -60,7 +60,7 @@ export default { ``` -如果代理是 [`readonly`](#readonly) 创建的，但还包装了由 [`reactive`](#reactive) 创建的另一个代理，它也会返回 `true`。 +如果 Proxy 是 [`readonly`](#readonly) 创建的，但还包装了由 [`reactive`](#reactive) 创建的另一个 Proxy ，它也会返回 `true`。 ```js{7-15} diff --git a/src/api/options-composition.md b/src/api/options-composition.md index f4e8393cb..1ae0374cc 100644 --- a/src/api/options-composition.md +++ b/src/api/options-composition.md @@ -76,7 +76,7 @@ - `from` property 是在可用的注入内容中搜索用的 key (字符串或 Symbol) - `default` property 是降级情况下使用的 value - > 提示：提示：`provide` 和 `inject` 绑定并不是可响应的。这是刻意为之的。然而，如果你传入了一个可监听的对象，那么其对象的 property 还是可响应的。 + > 提示：提示：`provide` 和 `inject` 绑定并不是响应式的。这是刻意为之的。然而，如果你传入了一个响应式的对象，那么其对象的 property 仍是响应式的。 - **示例：** @@ -225,7 +225,7 @@ - **渲染函数/JSX 的方法** - `setup` 还可以返回一个渲染函数，该函数可以直接使用在同一作用域中声明的反应状态： + `setup` 还可以返回一个渲染函数，该函数可以直接使用在同一作用域中声明的响应式状态： ```js import { h, ref, reactive } from 'vue' diff --git a/src/api/refs-api.md b/src/api/refs-api.md index cd95df94c..7ab05ebcf 100644 --- a/src/api/refs-api.md +++ b/src/api/refs-api.md @@ -203,7 +203,7 @@ type CustomRefFactory = ( ```js const foo = shallowRef({}) -// 改变ref的值是响应式的 +// 改变 ref 的值是响应式的 foo.value = {} // 但是这个值不会被转换。 isReactive(foo.value) // false @@ -225,7 +225,7 @@ watchEffect(() => { console.log(shallow.value.greet) }) -// 这不会触发效果，因为ref很浅 +// 这不会触发作用，因为 ref 很浅层 shallow.value.greet = 'Hello, universe' // 记录 "Hello, universe" diff --git a/src/api/special-attributes.md b/src/api/special-attributes.md index 604a24bb3..d499342c1 100644 --- a/src/api/special-attributes.md +++ b/src/api/special-attributes.md @@ -50,7 +50,7 @@ 当 `v-for` 用于元素或组件的时候，引用信息将是包含 DOM 节点或组件实例的数组。 - 关于 ref 注册时间的重要说明：因为 ref 本身是作为渲染结果被创建的，在初始渲染的时候你不能访问它们 - 它们还不存在！`$refs` 也不是响应式的，因此你不应该试图用它在模板中做数据绑定。 + 关于 ref 注册时间的重要说明：因为 ref 本身是作为渲染结果被创建的，在初始渲染的时候你不能访问它们 - 它们还不存在！`$refs` 也是非响应式的，因此你不应该试图用它在模板中做数据绑定。 - **参考**[子组件 Refs](../guide/component-template-refs.html) diff --git a/src/guide/component-edge-cases.md b/src/guide/component-edge-cases.md index 59fc51538..ab6756cc4 100644 --- a/src/guide/component-edge-cases.md +++ b/src/guide/component-edge-cases.md @@ -9,11 +9,11 @@ ## 控制更新 -得益于其响应式系统，Vue 总是知道何时更新 (如果你使用正确的话)。但是，在某些边缘情况下，你可能希望强制更新，尽管事实上没有任何反应性数据发生更改。还有一些情况下，你可能希望防止不必要的更新。 +得益于其响应性系统，Vue 总是知道何时更新 (如果你使用正确的话)。但是，在某些边缘情况下，你可能希望强制更新，尽管事实上没有任何响应式数据发生更改。还有一些情况下，你可能希望防止不必要的更新。 ### 强制更新 -如果你发现自己需要在 Vue 中强制更新，在 99.99%的情况下，你在某个地方犯了错误。例如，你可能依赖于 Vue 反应性系统未跟踪的状态，例如，在组件创建之后添加了 `data` 属性。 +如果你发现自己需要在 Vue 中强制更新，在 99.99%的情况下，你在某个地方犯了错误。例如，你可能依赖于 Vue 响应性系统未跟踪的状态，例如，在组件创建之后添加了 `data` 属性。 但是，如果你已经排除了上述情况，并且发现自己处于这种非常罕见的情况下，必须手动强制更新，那么你可以使用 [`$forceUpdate`](../api/instance-methods.html#forceupdate)。 diff --git a/src/guide/composition-api-introduction.md b/src/guide/composition-api-introduction.md index 2437ef0ab..ce6d64cf6 100644 --- a/src/guide/composition-api-introduction.md +++ b/src/guide/composition-api-introduction.md @@ -127,7 +127,7 @@ setup (props) { } ``` -这是我们的出发点，但它还不能工作，因为我们的 `repositories` 变量不是被动的。这意味着从用户的角度来看，仓库列表将保持为空。我们来解决这个问题！ +这是我们的出发点，但它还不能工作，因为我们的 `repositories` 变量是非响应式的。这意味着从用户的角度来看，仓库列表将保持为空。我们来解决这个问题！ ### 带 `ref` 的响应式变量 @@ -317,13 +317,13 @@ setup (props) { const repositories = ref([]) const getUserRepositories = async () => { - // 更新`prop.user ` 到 `user.value`访问引用值 + // 更新 `prop.user ` 到 `user.value` 访问引用值 repositories.value = await fetchUserRepositories(user.value) } onMounted(getUserRepositories) - // 在用户prop的响应式引用上设置一个侦听器 + // 在用户 prop 的响应式引用上设置一个侦听器 watch(user, getUserRepositories) return { @@ -363,18 +363,18 @@ import { ref, onMounted, watch, toRefs, computed } from 'vue' // in our component setup (props) { - // 使用 `toRefs` 创建对props的 `user` property 的响应式引用 + // 使用 `toRefs` 创建对 props 的 `user` property 的响应式引用 const { user } = toRefs(props) const repositories = ref([]) const getUserRepositories = async () => { - // 更新`props.user ` 到 `user.value`访问引用值 + // 更新 `props.user ` 到 `user.value` 访问引用值 repositories.value = await fetchUserRepositories(user.value) } onMounted(getUserRepositories) - // 在用户prop的响应式引用上设置一个侦听器 + // 在用户 prop 的响应式引用上设置一个侦听器 watch(user, getUserRepositories) const searchQuery = ref('') diff --git a/src/guide/migration/render-function-api.md b/src/guide/migration/render-function-api.md index 060d00d3d..650f05cc1 100644 --- a/src/guide/migration/render-function-api.md +++ b/src/guide/migration/render-function-api.md @@ -65,7 +65,7 @@ export default { ### 3.x 语法 -在 3.x 中，由于 `render` 函数不再接收任何参数，它将主要用于 `setup()` 函数内部。这还有一个好处：可以访问作用域中声明的被动状态和函数，以及传递给 `setup()` 的参数。 +在 3.x 中，由于 `render` 函数不再接收任何参数，它将主要用于 `setup()` 函数内部。这还有一个好处：可以访问作用域中声明的响应式状态和函数，以及传递给 `setup()` 的参数。 ```js diff --git a/src/guide/reactivity-computed-watchers.md b/src/guide/reactivity-computed-watchers.md index 15aa84e02..42893c16c 100644 --- a/src/guide/reactivity-computed-watchers.md +++ b/src/guide/reactivity-computed-watchers.md @@ -32,7 +32,7 @@ console.log(count.value) // 0 ## `watchEffect` -为了根据反应状态*自动应用*和*重新应用*副作用，我们可以使用 `watchEffect` 方法。它立即执行传入的一个函数，同时响应式追踪其依赖，并在其依赖变更时重新运行该函数。 +为了根据响应式状态*自动应用*和*重新应用*副作用，我们可以使用 `watchEffect` 方法。它立即执行传入的一个函数，同时响应式追踪其依赖，并在其依赖变更时重新运行该函数。 ```js const count = ref(0) @@ -146,8 +146,8 @@ watchEffect( `onTrack` 和 `onTrigger` 选项可用于调试侦听器的行为。 -- 当响应式 property 或 ref 作为依赖项被追踪时，将调用 `onTrack` -- 当依赖项变更导致副作用被触发时，将调用 `onTrigger` +- `onTrack`将在响应式 property 或 ref 作为依赖项被追踪时被调用。 +- `onTrigger`将在依赖项变更导致副作用被触发时被调用。 这两个回调都将接收到一个包含有关所依赖项信息的调试器事件。建议在以下回调中编写 `debugger` 语句来检查依赖关系： diff --git a/src/guide/reactivity-fundamentals.md b/src/guide/reactivity-fundamentals.md index f41620059..9d12d6a27 100644 --- a/src/guide/reactivity-fundamentals.md +++ b/src/guide/reactivity-fundamentals.md @@ -45,7 +45,7 @@ console.log(count.value) // 1 ### Ref 展开 -当 ref 作为渲染上下文 (从 [setup ()](composition-api-setup.html) 中返回的对象) 上的 property 返回并可以在模板中被访问时，它将自动展开为内部值。不需要在模板中追加 `.value`： +当 ref 作为渲染上下文 (从 [setup()](composition-api-setup.html) 中返回的对象) 上的 property 返回并可以在模板中被访问时，它将自动展开为内部值。不需要在模板中追加 `.value`： ```vue-html