Skip to content

Commit 9762186

Browse files
author
勾股
committed
Merge branch '0.12-zh' of github.com:lvdou/vuejs.org into 0.12-zh
2 parents 2789444 + 4d06ab7 commit 9762186

File tree

11 files changed

+105
-74
lines changed

11 files changed

+105
-74
lines changed

source/api/directives.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -47,33 +47,33 @@ order: 6
4747

4848
- 本指令需要一个参数
4949

50-
更新元素的指定属性(由参数指定)
50+
更新元素的指定特性(由参数指定)
5151

5252
**例子:**
5353

5454
``` html
5555
<canvas v-attr="width:w, height:h"></canvas>
5656
```
5757

58-
除0外的其他伪值将移除该属性.
58+
除0外的其他伪值将移除该特性.
5959

60-
或者,你可以直接将该指令绑定到一个对象。对象关键词keys将使属性列根据对应值予以设定
60+
或者,你可以直接将该指令绑定到一个对象。对象关键词keys将使特性列根据对应值予以设定
6161

6262
本质上,普通特性中的 {{ Mustache }} 插值会被编译到计算后的`v-attr`指令当中。
6363

64-
从0.12.8开始,若设定(property)存在,`v-attr` 也设置(set)相应设定。例如,<input value="{% raw %}{{val}}{% endraw %}"> 将不仅更新属性,也设置设定值。如果元素绑定的属性没有相应的设定,则不会去设置。
64+
从0.12.8开始,若属性(property)存在,`v-attr` 也设置相应属性。例如,<input value="{% raw %}{{val}}{% endraw %}"> 将不仅更新特性,也设置属性值。如果元素绑定的特性没有相应的属性,则不会去设置。
6565

66-
<p class="tip">在为`<img>`元素设置`src`属性时,应该使用`v-attr`绑定而不是 mustache 模板绑定。浏览器会先于 Vue.js 对你的模板进行解析。所以当浏览器试图获取图片 URL 时,使用 mustache 模板绑定的数据会导致404错误。</p>
66+
<p class="tip">在为`<img>`元素设置`src`特性时,应该使用`v-attr`绑定而不是 mustache 模板绑定。浏览器会先于 Vue.js 对你的模板进行解析。所以当浏览器试图获取图片 URL 时,使用 mustache 模板绑定的数据会导致404错误。</p>
6767

6868
### v-style
6969

7070
- 本指令接受一个配置参数
7171

72-
将CSS属性以内联的形式应用到元素上
72+
将CSS特性以内联的形式应用到元素上
7373

7474
如果没有参数名,绑定值也可以是一个字符串或者一个对象。
7575

76-
- 如果参数值为字符串,则会将该元素的`style.cssText`属性设置为参数的值
76+
- 如果参数值为字符串,则会将该元素的`style.cssText`特性设置为参数的值
7777
- 如果参数值为对象,则每一对 key/value 都会被设置到元素的`style`对象上。
7878

7979
**例子:**

source/guide/application.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ describe('my-component', function () {
117117
<p class="tip">因为 Vue.js 的指令异步响应数据的更新,当你需要在数据更新后断言DOM的状态时,你需要在一个`Vue.nextTick` 回调里做这件事。</p>
118118

119119
## 部署产品
120-
为了缩小体积,最小化的独立版本Vue.js已去除所有的警告信息,但当你用像Browserify、Webpack这样的工具构建Vue.js产品时,它是不那么明示如何处理的
120+
为了缩小体积,最小化的独立版本Vue.js已去除所有的警告信息,但当你用像Browserify、Webpack这样的工具构建Vue.js产品时,如何进行这样的处理不是那么显而易见的
121121

122122
从0.12.8开始,有一个相当简单的配置工具来去除警告信息:
123123

source/guide/custom-directive.md

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ order: 9
55

66
## 基础
77

8-
Vue.js允许你注册自定义指令,实质上是让你教Vue一些新技巧:怎样将数据的变化映射成DOM的行为。你可以使用`Vue.directive(id, definition) `的方法传入**指令名称****定义对象**来注册一个全局自定义指令。定义对象要能提供一些钩子函数(全都可选):
8+
Vue.js允许你注册自定义指令,实质上是让你教Vue一些新技巧:怎样将数据的变化映射成DOM的行为。你可以使用`Vue.directive(id, definition) `的方法传入**指令id****定义对象**来注册一个全局自定义指令,经由一个指令id来完成一个定义的对象。定义对象要能提供一些钩子函数(全都可选):
99

1010
- **bind**:仅调用一次,当指令第一次绑定元素的时候。
11-
- **update**: 第一次调用是在 bind之后,用的是初始值;以后每当绑定的值发生变化就会被调用,新值与旧值作为参数。
11+
- **update**: 第一次是紧跟在bind之后调用,用的是初始值;以后每当绑定的值发生变化就会被调用,新值与旧值作为参数。
1212
- **unbind**:仅调用一次,当指令解绑元素的时候。
1313

1414
**Example**
@@ -45,18 +45,18 @@ Vue.directive('my-directive', function (value) {
4545
})
4646
```
4747

48-
所有的钩子函数会被复制到实际的**指令对象**中,而指令对象就是访问这些函数时的 `this`上下文环境。指令对象有一些有用的公开属性
48+
所有的钩子函数会被复制到实际的**指令对象**中,通过它,可以如同`this`上下文环境一样访问这些函数的内部功能。指令对象有一些有用的公开设定
4949

5050
- **el**: 指令绑定的元素
51-
- **vm**: 拥有该指令的上下文视图模型
51+
- **vm**: 拥有该指令的视图模型上下文
5252
- **expression**: 绑定的表达式,不包括参数和过滤器
5353
- **arg**: 当前参数
5454
- **raw**: 未被解析的原始表达式
5555
- **name**: 不带前缀的指令名
5656

57-
<p class="tip"> 你应该把所有的这些属性看成是只读的,并且限制它们发生改变。你也可以给指令对象附加自定义的属性,但是注意不要重写已有的内部属性。
57+
<p class="tip"> 你应该把所有的这些设定看成是只读的,并且限制它们发生改变。你也可以给指令对象附加自定义的属性,但是注意不要重写已有的内部属性。
5858

59-
下面是自定义指令使用其中一些属性的例子
59+
下面是自定义指令使用其中一些设定的例子
6060

6161
``` html
6262
<div id="demo" v-demo="LightSlateGray : msg"></div>
@@ -132,9 +132,9 @@ Vue.directive('demo', function (value) {
132132
```
133133

134134

135-
## 直接指令
135+
## 字面指令
136136

137-
如果在创建自定义指令的时候传入 `isLiteral: true`那么属性值就会被看成直接字符串,并被指定为该指令的`表达式`。指令不会试图建立数据监视。
137+
如果在创建自定义指令的时候传入 `isLiteral: true`那么特性值就会被看成直接字符串,并被指定为该指令的`表达式`。指令不会试图建立数据监视。
138138

139139
Example:
140140

@@ -151,9 +151,9 @@ Vue.directive('literal-dir', {
151151
})
152152
```
153153

154-
### 动态直接量
154+
### 动态字面
155155

156-
然而,在直接指令含有mustache标签的情形下,指令的行为如下所示:
156+
然而,在字面指令含有mustache标签的情形下,指令的行为如下所示:
157157

158158
- 指令实例会有一个标记,`this._isDynamicLiteral` 被设为 `true`
159159

@@ -208,7 +208,7 @@ Vue.directive('my-directive', {
208208

209209
## 深度监视
210210

211-
如果你希望在一个 `Object` 上使用自定义指令,并且当对象的内嵌属性发生变化时触发指令的 `update` 函数,那么你就要在指令的定义中传入 `deep: true`
211+
如果你希望在一个 `Object` 上使用自定义指令,并且当对象的内嵌特性发生变化时触发指令的 `update` 函数,那么你就要在指令的定义中传入 `deep: true`
212212

213213
``` html
214214
<div v-my-directive="obj"></div>
@@ -226,13 +226,13 @@ Vue.directive('my-directive', {
226226

227227
## 指令优先级
228228

229-
你可以选择给指令提供一个优先级数(默认是0)。同一个元素上优先级越高的指令会比其他的指令处理得早一些。优先级一样的指令会按照其在元素属性列表中出现的顺序依次处理,但是不能保证这个顺序在不同的浏览器中是一致的。
229+
你可以选择给指令提供一个优先级数(默认是0)。同一个元素上优先级越高的指令会比其他的指令处理得早一些。优先级一样的指令会按照其在元素特性列表中出现的顺序依次处理,但是不能保证这个顺序在不同的浏览器中是一致的。
230230

231231
你可以去[API reference](../api/directives.html)看一些内置指令的优先级。另外,逻辑控制指令`v-repeat`, `v-if`被视为“终端指令”,它们在编译过程中始终拥有最高的优先级。
232232

233233
## 元素指令
234234

235-
有时候,我们可能想要我们的指令被用于自定义元素的form中,而不是作为一个属性。这与Angular的`E`类指令的概念非常相似。元素指令向一个成熟的组件(本向导随后将解释它),提供一个轻量化的选择。你可以注册一个自定义的元素指令,像这样:
235+
有时候,我们可能想要我们的指令被用于一个表单的自定义元素,而不是作为一个特性。这与Angular的`E`类指令的概念非常相似。元素指令向一个成熟的组件(本向导随后将解释它),提供一个轻量化的选择。你可以注册一个自定义的元素指令,像这样:
236236

237237
``` js
238238
Vue.elementDirective('my-directive', {
@@ -255,8 +255,8 @@ Vue.elementDirective('my-directive', {
255255
<my-directive></my-directive>
256256
```
257257

258-
元素指令不能接受参数或表达式,但是它可以读取元素的属性,来决定它的行为。
258+
元素指令不能接受参数或表达式,但是它可以读取元素的特性,来决定它的行为。
259259

260-
与通常的指令有个很大的不同,元素指令是**终端**式的,这意味着,一旦Vue遇到一个元素指令,它将导致元素及它的子元素独立 - 只有元素指令可以操作该元素及其子元素
260+
与通常的指令有个很大的不同,元素指令是**终端**式的,这意味着,一旦Vue遇到一个元素指令,它将导致元素及它的子元素独立 - 即只有元素指令可以操作该元素及其子元素
261261

262262
下面,我们来看怎样写一个[自定义过滤器](../guide/custom-filter.html)

source/guide/custom-filter.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ order: 10
55

66
## 基本用法
77

8-
和自定义指令类似,你可以用全局方法 `Vue.filter()`,传递一个**过滤器 ID**和一个**过滤器函数**注册一个自定义过滤器。过滤器函数会接受一个参数值并返回将其转换后的值:
8+
和自定义指令类似,你可以用全局方法 `Vue.filter()`,传递一个**过滤器 ID**和一个**过滤器函数**来注册一个自定义过滤器。过滤器函数会接受一个参数值并返回将其转换后的值:
99

1010
``` js
1111
Vue.filter('reverse', function (value) {
@@ -33,7 +33,7 @@ Vue.filter('wrap', function (value, begin, end) {
3333

3434
## 双向过滤器
3535

36-
现在我们已经在展示视图之前用过滤器把模型里的值进行了转换。其实我们也可以定义一个过滤器在值从视图 (input 元素) 写回模型之前进行转换
36+
现在我们已经在展示到视图之前用过滤器把模型model里的值进行了转换。其实我们也可以定义一个过滤器在值从视图view (input 元素) 写回模型model之前进行转换
3737

3838
``` js
3939
Vue.filter('check-email', {
@@ -52,7 +52,7 @@ Vue.filter('check-email', {
5252

5353
## 动态参数
5454

55-
如果一个过滤器参数没有被单引号所围住,在vm的数据上下文里,它会被动态地认定。此外,过滤器总是调用当前vm作为它的`this`上下文。
55+
如果一个过滤器参数没有被单引号所围住,它会在vm的数据上下文里被动态地认定。此外,过滤器总是调用当前vm作为它的`this`上下文。
5656

5757
``` html
5858
<input v-model="userInput">
@@ -66,8 +66,8 @@ Vue.filter('concat', function (value, input) {
6666
})
6767
```
6868

69-
在上面这个例子中,你用表达式即可完成相同的结果。但是面对更复杂的处理时,如果需要不止一个声明,你就得把它们放到一个可推导的属性中或一个自定义过滤器中
69+
在上面这个例子中,你用表达式即可完成相同的结果。但是面对更复杂的处理时,如果需要不止一个声明,你就得把它们放到一个可计算的属性中或一个自定义过滤器中
7070

7171
内建的 `filterBy``orderBy` 过滤器都是根据传入的数组以及所属 Vue 实例状态而运行的过滤器。
7272

73-
Alright!是时候了解[组件系统](../guide/components.html)的工作方式了。
73+
很好!是时候了解[组件系统](../guide/components.html)的工作方式了。

source/guide/events.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ type: guide
33
order: 6
44
---
55

6-
你可以使用 `v-on` 指令来绑定并监听 DOM 事件。绑定的内容可以是一个事件句柄函数 (后面无需跟括号) 或一个内联表达式。如果提供的是一个句柄函数,则原来的 DOM event 对象会被作为第一个参数传入,同时这个 event 对象会附带 `targetVM` 属性,指向触发该事件的相应的 ViewModel:
6+
你可以使用 `v-on` 指令来绑定并监听 DOM 事件。绑定的内容可以是一个事件句柄函数 (后面无需跟括号) 或一个内联表达式。如果提供的是一个句柄函数,则原来的 DOM event 会被作为(第一个)参数传入,同时这个 event 会附带 `targetVM` 设定,指向触发该事件的相应的 ViewModel:
77

88
``` html
99
<div id="demo">
@@ -29,7 +29,7 @@ new Vue({
2929

3030
## 执行表达式句柄
3131

32-
`targetVM``v-repeat` 里使用 `v-on` 时显得特别有用,因为 `v-repeat` 会创建大量子 ViewModel。这样的话,通过执行表达式的方式,把代表当前上下文 ViewModel 的 `this` 传进去,就显得非常方便。
32+
当在 `v-repeat` 里使用 `v-on` 时,`targetVM` 显得很有用,因为 `v-repeat` 会创建大量子 ViewModel。这样的话,通过执行表达式的方式,把代表当前ViewModel上下文的 `this` 传进去,就显得非常方便。
3333

3434
``` html
3535
<ul id="list">
@@ -88,7 +88,7 @@ new Vue({
8888
<input v-on="keyup:submit | key 'enter'">
8989
```
9090

91-
API 索引中有 [key 过滤器预置的完整列表](../api/filters.html#key).
91+
查看API参考:[预置的key过滤器完整列表](../api/filters.html#key).
9292

9393
## 为什么要在 HTML 中写监听器?
9494

source/guide/extending.md

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ var component = new Component() // -> "hello from mixin!"
3939
你可以撰写以下几种典型类型的插件:
4040

4141
1. 添加一个或几个全局方法。比如 [vue-element](https://github.com/vuejs/vue-element)
42-
2. 添加一个或几个全局资源:指令、过滤器、过渡效果等。比如 [vue-touch](https://github.com/vuejs/vue-touch)
42+
2. 添加一个或几个全局资源:指令、过滤器、动画效果等。比如 [vue-touch](https://github.com/vuejs/vue-touch)
4343
3. 通过绑定到 `Vue.prototype` 的方式添加一些 Vue 实例方法。这里有个约定,就是 Vue 的实例方法应该带有 `$` 前缀,这样就不会和用户的数据和方法产生冲突了。
4444

4545
``` js
@@ -71,7 +71,8 @@ Vue.use('my-plugin', {
7171
## 现有的工具
7272

7373
- [vue-resource](https://github.com/vuejs/vue-resource): 一个插件,为用XMLHttpRequest或JSONP生成网络请求、响应提供服务。
74-
- [vue-devtools](https://github.com/vuejs/vue-devtools):一个用来 debug Vue.js 应用程序的 Chrome 开发者工具扩展。
74+
- [vue-validator](https://github.com/vuejs/vue-validator): 一个表单验证的插件。
75+
- [vue-devtools](https://github.com/vuejs/vue-devtools):一个用来调试Vue.js应用程序的Chrome浏览器开发者工具扩展。
7576
- [vue-touch](https://github.com/vuejs/vue-touch):添加基于 Hammer.js 的触摸手势的指令。
7677
- [vue-element](https://github.com/vuejs/vue-element): 用 Vue.js 注册 Custom Elements。
7778
- [用户贡献的工具列表](https://github.com/yyx990803/vue/wiki/User-Contributed-Components-&-Tools)

0 commit comments

Comments
 (0)