Skip to content

Commit 996f905

Browse files
committed
获取官方更新合并分支
2 parents b38f599 + 01f05e5 commit 996f905

25 files changed

+3428
-2759
lines changed

src/v2/api/index.md

Lines changed: 108 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -154,10 +154,10 @@ type: api
154154

155155
- **参考:** [组件](../guide/components.html)
156156

157-
<h3 id="Vue-nextTick">Vue.nextTick( callback, [context] )</h3>
157+
<h3 id="Vue-nextTick">Vue.nextTick( [callback, context] )</h3>
158158

159159
- **参数:**
160-
- `{Function} callback`
160+
- `{Function} [callback]`
161161
- `{Object} [context]`
162162

163163
- **用法:**
@@ -173,6 +173,8 @@ type: api
173173
})
174174
```
175175

176+
> 2.1.0新增:如果没有提供回调且支持 promise 的环境中返回 promise。
177+
176178
- **参考:** [异步更新队列](../guide/reactivity.html#Async-Update-Queue)
177179

178180
<h3 id="Vue-set">Vue.set( object, key, value )</h3>
@@ -934,13 +936,13 @@ type: api
934936

935937
### vm.$slots
936938

937-
- **类型:** `Object`
939+
- **类型** `{ [name: string]: ?Array<VNode> }`
938940

939941
- **只读**
940942

941943
- **详细:**
942944

943-
用来访问被 [slot 分发](../guide/components.html#Content-Distribution-with-Slots)的内容。每个[具名 slot](../guide/components.html#Named-Slots) 有其相应的属性(例如:`slot="foo"` 中的内容将会在 `vm.$slots.foo` 中被找到)。`default` 属性包括了所有没有被包含在一个具名 slot 中的节点。
945+
用来访问被 [slot 分发](../guide/components.html#Content-Distribution-with-Slots)的内容。每个[具名 slot](../guide/components.html#Named-Slots) 有其相应的属性(例如:`slot="foo"` 中的内容将会在 `vm.$slots.foo` 中被找到)。`default` 属性包括了所有没有被包含在具名 slot 中的节点。
944946

945947
在使用 [render 函数](../guide/render-function.html)书写一个组件时,访问 `vm.$slots` 最有帮助。
946948

@@ -978,21 +980,41 @@ type: api
978980
```
979981

980982
- **参考:**
981-
- [`<slot>` 组件](#slot)
983+
- [`<slot>` 组件](#slot-1)
982984
- [使用 Slots 进行内容分发](../guide/components.html#Content-Distribution-with-Slots)
983-
- [Render 函数](../guide/render-function.html)
985+
- [Render 函数](../guide/render-function.html#Slots)
986+
987+
### vm.$scopedSlots
988+
989+
> 2.1.0新增
990+
991+
- **类型:** `{ [name: string]: props => VNode | Array<VNode> }`
992+
993+
- **只读**
994+
995+
- **详细:**
996+
997+
Used to programmatically access [scoped slots](../guide/components.html#Scoped-Slots). For each slot, including the `default` one, the object contains a corresponding function that returns VNodes.
998+
999+
Accessing `vm.$scopedSlots` is most useful when writing a component with a [render function](../guide/render-function.html).
1000+
1001+
- **参考:**
1002+
- [`<slot>` 组件](#slot-1)
1003+
- [Scoped Slots](../guide/components.html#Scoped-Slots)
1004+
- [Render 函数](../guide/render-function.html#Slots)
1005+
9841006

9851007
### vm.$refs
9861008

987-
- **类型:** `Object`
1009+
- **类型** `Object`
9881010

9891011
- **只读**
9901012

991-
- **详细:**
1013+
- **详细**
9921014

9931015
一个对象,其中包含了所有拥有 `ref` 注册的子组件。
9941016

995-
- **另见:**
1017+
- **另见**
9961018
- [子组件引用](../guide/components.html#Child-Component-Refs)
9971019
- [ref](#ref)
9981020

@@ -1206,15 +1228,18 @@ type: api
12061228

12071229
迫使Vue实例重新渲染。注意它仅仅影响实例本身和插入插槽内容的子组件,而不是所有子组件。
12081230

1209-
<h3 id="vm-nextTick">vm.$nextTick( callback )</h3>
1231+
<h3 id="vm-nextTick">vm.$nextTick( [callback] )</h3>
12101232

12111233
- **参数:**
1212-
- `{Function} callback`
1234+
- `{Function} [callback]`
12131235

12141236
- **用法:**
12151237

12161238
将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它,然后等待 DOM 更新。它跟全局方法 Vue.nextTick 一样,不同的是回调的 `this` 自动绑定到调用它的实例上。
12171239

1240+
1241+
> 2.1.0新增:如果没有提供回调且支持 promise 的环境中返回 promise。
1242+
12181243
- **示例:**
12191244

12201245
``` js
@@ -1290,39 +1315,39 @@ type: api
12901315
```
12911316
- **参考:** [数据绑定语法 - 插值](../guide/syntax.html#Raw-HTML)
12921317

1293-
### v-if
1318+
### v-show
12941319

12951320
- **类型:** `any`
12961321

12971322
- **用法:**
12981323

1299-
根据表达式的值的真假条件渲染元素。在切换时元素及它的数据绑定 / 组件被销毁并重建。如果元素是 `<template>` ,将提出它的内容作为条件块
1324+
根据表达式之真假值,切换元素的 `display` CSS 属性
13001325

13011326
当条件变化时该指令触发过渡效果。
13021327

1303-
- **参考:** [条件渲染 - v-if](../guide/conditional.html)
1328+
- **参考:** [条件渲染 - v-show](../guide/conditional.html#v-show)
13041329

1305-
### v-show
1330+
### v-if
13061331

13071332
- **类型:** `any`
13081333

13091334
- **用法:**
13101335

1311-
根据表达式之真假值,切换元素的 `display` CSS 属性
1336+
根据表达式的值的真假条件渲染元素。在切换时元素及它的数据绑定 / 组件被销毁并重建。如果元素是 `<template>` ,将提出它的内容作为条件块
13121337

13131338
当条件变化时该指令触发过渡效果。
13141339

1315-
- **参考:** [条件渲染 - v-show](../guide/conditional.html#v-show)
1340+
- **参考:** [条件渲染 - v-if](../guide/conditional.html)
13161341

13171342
### v-else
13181343

13191344
- **不需要表达式**
13201345

1321-
- **限制:** 前一兄弟元素必须有 `v-if`
1346+
- **限制:** 前一兄弟元素必须有 `v-if``v-else-if`
13221347

13231348
- **用法:**
13241349

1325-
`v-if` 添加 “else 块”。
1350+
`v-if` 或者 `v-else-if` 添加 “else 块”。
13261351

13271352
```html
13281353
<div v-if="Math.random() > 0.5">
@@ -1336,6 +1361,35 @@ type: api
13361361
- **参考:**
13371362
- [条件渲染 - v-else](../guide/conditional.html#v-else)
13381363

1364+
### v-else-if
1365+
1366+
> 2.1.0新增
1367+
1368+
- **Expects:** `any`
1369+
1370+
- **Restriction:** previous sibling element must have `v-if` or `v-else-if`.
1371+
1372+
- **Usage:**
1373+
1374+
Denote the "else if block" for `v-if`. Can be chained.
1375+
1376+
```html
1377+
<div v-if="type === 'A'">
1378+
A
1379+
</div>
1380+
<div v-else-if="type === 'B'">
1381+
B
1382+
</div>
1383+
<div v-else-if="type === 'C'">
1384+
C
1385+
</div>
1386+
<div v-else>
1387+
Not A/B/C
1388+
</div>
1389+
```
1390+
1391+
- **See also:** [Conditional Rendering - v-else-if](../guide/conditional.html#v-else-if)
1392+
13391393
### v-for
13401394

13411395
- **类型:** `Array | Object | number | string`
@@ -1452,7 +1506,8 @@ type: api
14521506
- **参数:** `attrOrProp (optional)`
14531507

14541508
- **修饰符:**
1455-
- `.prop` - 被用于绑定 DOM 属性。
1509+
- `.prop` - 被用于绑定 DOM 属性。([what's the difference?](http://stackoverflow.com/questions/6003819/properties-and-attributes-in-html#answer-6004028))
1510+
- `.camel` - transform the kebab-case attribute name into camelCase. (supported since 2.1.0)
14561511

14571512
- **用法:**
14581513

@@ -1495,6 +1550,14 @@ type: api
14951550
<svg><a :xlink:special="foo"></a></svg>
14961551
```
14971552

1553+
The `.camel` modifier allows camelizing a `v-bind` attribute name when using in-DOM templates, e.g. the SVG `viewBox` attribute:
1554+
1555+
``` html
1556+
<svg :view-box.camel="viewBox"></svg>
1557+
```
1558+
1559+
`.camel` is not needed if you are using string templates, or compiling with `vue-loader`/`vueify`.
1560+
14981561
- **参考:**
14991562
- [Class 与 Style 绑定](../guide/class-and-style.html)
15001563
- [组件 - 组件 Props](../guide/components.html#Props)
@@ -1512,7 +1575,7 @@ type: api
15121575
- **修饰符:**
15131576
- [`.lazy`](../guide/forms.html#lazy) - 取代 `input` 监听 `change` 事件
15141577
- [`.number`](../guide/forms.html#number) - 输入字符串转为数字
1515-
- [`.trim`](../guild/forms.html#trim) - 输入首尾空格过滤
1578+
- [`.trim`](../guide/forms.html#trim) - 输入首尾空格过滤
15161579

15171580
- **用法:**
15181581

@@ -1766,6 +1829,10 @@ type: api
17661829

17671830
### keep-alive
17681831

1832+
- **Props:**
1833+
- `include` - string or RegExp. Only components matched by this will be cached.
1834+
- `exclude` - string or RegExp. Any component matched by this will not be cached.
1835+
17691836
- **用法:**
17701837

17711838
`<keep-alive>` 包裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。和 `<transition>` 相似,`<keep-alive>` 是一个抽象组件:它自身不会渲染一个 DOM 元素,也不会出现在父组件链中。
@@ -1794,6 +1861,26 @@ type: api
17941861
</transition>
17951862
```
17961863

1864+
- **`include` and `exclude`**
1865+
1866+
> New in 2.1.0
1867+
1868+
The `include` and `exclude` props allow components to be conditionally cached. Both props can either be a comma-delimited string or a RegExp:
1869+
1870+
``` html
1871+
<!-- comma-delimited string -->
1872+
<keep-alive include="a,b">
1873+
<component :is="view"></component>
1874+
</keep-alive>
1875+
1876+
<!-- regex (use v-bind) -->
1877+
<keep-alive :include="/a|b/">
1878+
<component :is="view"></component>
1879+
</keep-alive>
1880+
```
1881+
1882+
The match is first checked on the component's own `name` option, then its local registration name (the key in the parent's `components` option) if the `name` option is not available. Anonymous components cannot be matched against.
1883+
17971884
<p class="tip">`<keep-alive>` 不会在函数式组件中正常工作,因为它们没有缓存实例。</p>
17981885

17991886
- **参考:** [动态组件 - keep-alive](../guide/components.html#keep-alive)

src/v2/guide/comparison.md

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,6 @@ Vue 和 React 也提供功能性组件,这些组件因为都是没有声明,
7575
<td>343ms</td>
7676
<td>453ms</td>
7777
</tr>
78-
</tr>
7978
</tbody>
8079
</table>
8180
{% endraw %}
@@ -92,9 +91,9 @@ To avoid unnecessary re-renders of child components, you need to implement `shou
9291

9392
显然,在生产环境中的性能是至关重要的,目前为止我们所具体讨论的便是针对此环境。但开发过程中的表现也不容小视。不错的是用 Vue 和 React 开发大多数应用的速度都是足够快的。
9493

95-
然而,假如你要开发一个对性能要求比较高的数据可视化或者动画的应用时,你需要了解到下面这点:在开发中,Vue 每秒最高处理 10 帧,而 React 每秒最高处理不到 1 帧。
94+
当性能在生产中性能是直接与终端用户体验相关的更重要的指标时,表现在开发中仍然很重要,因为它是与开发相关经验
9695

97-
Both Vue and React remain fast enough in development for most normal applications. However, when prototyping high frame-rate data visualizations or animations, we've seen cases of Vue handling 10 frames per second in development while React dropping to about 1 frame per second.
96+
然而,假如你要开发一个对性能要求比较高的数据可视化或者动画的应用时,你需要了解到下面这点:在开发中,Vue 每秒最高处理 10 帧,而 React 每秒最高处理不到 1 帧。
9897

9998
这是由于 React 有大量的检查机制,这会让它提供许多有用的警告和错误提示信息。我们同样认为这些是很重要的,但是我们在实现这些检查时,也更加密切地关注了性能方面。
10099

0 commit comments

Comments
 (0)