Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

关于计算属性一节的翻译讨论 #190

Closed
wants to merge 1 commit into from
Closed
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions src/v2/guide/computed.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ order: 5
</div>
```

在这种情况下,模板不再简单和清晰。在实现反向显示 `message` 之前,你应该确认它。这个问题在你不止一次反向显示 message 的时候变得更加糟糕
在这种情况下,模板不再是简单的、声明式的。你得看一会才能明白这是在反转message字符串。当你需要使用不止一次反转的message时,那就更糟了

这就是为什么任何复杂逻辑,你都应当使用**计算属性**。

Expand Down Expand Up @@ -78,7 +78,7 @@ console.log(vm.reversedMessage) // -> 'eybdooG'

你可以打开浏览器的控制台,修改 vm 。 `vm.reversedMessage` 的值始终取决于 `vm.message` 的值。

你可以像绑定普通属性一样在模板中绑定计算属性。 Vue 知道 `vm.reversedMessage` 依赖于 `vm.message` ,因此当 `vm.message` 发生改变时,依赖于 `vm.reversedMessage` 的绑定也会更新。而且最妙的是我们是声明式地创建这种依赖关系:计算属性的 getter 是干净无副作用的,因此也是易于测试和理解的。
你可以像绑定普通属性一样在模板中绑定计算属性。 Vue 知道 `vm.reversedMessage` 依赖于 `vm.message` ,因此当 `vm.message` 发生改变时,依赖于 `vm.reversedMessage` 的绑定也会更新。而且最妙的是我们是声明式地创建这种依赖关系:计算属性的 getter 是没有副作用的纯函数,因此也是易于测试和理解的。

### 计算缓存 vs Methods

Expand All @@ -99,7 +99,7 @@ methods: {

不经过计算属性,我们可以在 method 中定义一个相同的函数来替代它。对于最终的结果,两种方式确实是相同的。然而,不同的是**计算属性是基于它的依赖缓存**。计算属性只有在它的相关依赖发生改变时才会重新取值。这就意味着只要 `message` 没有发生改变,多次访问 `reversedMessage` 计算属性会立即返回之前的计算结果,而不必再次执行函数。

这也同样意味着如下计算属性将不会更新,因为 `Date.now()` 不是响应式依赖
这也同样意味着如下计算属性将不会更新,因为 `Date.now()` 不是一个可以响应的依赖

``` js
computed: {
Expand All @@ -115,7 +115,7 @@ computed: {

### 计算属性 vs Watched Property

Vue.js 提供了一个方法 `$watch` ,它用于观察 Vue 实例上的数据变动。当一些数据需要根据其它数据变化时, `$watch` 很诱人 —— 特别是如果你来自 AngularJS 。不过,通常更好的办法是使用计算属性而不是一个命令式的 `$watch` 回调。思考下面例子:
Vue.js 提供了一个更通用的方法 `$watch` ,它用于观察 Vue 实例上的数据变动。当一些数据需要根据其它数据变化时, `$watch` 很容易被过度使用 —— 特别是有 AngularJS 背景的同学。不过,通常更好的办法是使用计算属性而不是一个命令式的 `$watch` 回调。思考下面例子:

``` html
<div id="demo">{{ fullName }}</div>
Expand Down