Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit 01f05e5

Browse files
Merge pull request vuejs#279 from vuejs/master
获取官网更新
2 parents d83c722 + a4023b0 commit 01f05e5

File tree

23 files changed

+3383
-2738
lines changed

23 files changed

+3383
-2738
lines changed

‎src/v2/api/index.md‎

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

155155
- **See also:** [Components](../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
- **Arguments:**
160-
- `{Function} callback`
160+
- `{Function} [callback]`
161161
- `{Object} [context]`
162162

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

176+
> New in 2.1.0: returns a Promise if no callback is provided and Promise is supported in the execution environment.
177+
176178
- **See also:** [Async Update Queue](../guide/reactivity.html#Async-Update-Queue)
177179

178180
<h3 id="Vue-set">Vue.set( object, key, value )</h3>
@@ -928,13 +930,13 @@ All lifecycle hooks automatically have their `this` context bound to the instanc
928930

929931
### vm.$slots
930932

931-
- **Type:** `Object`
933+
- **Type:** `{ [name: string]: ?Array<VNode> }`
932934

933935
- **Read only**
934936

935937
- **Details:**
936938

937-
Used to access content [distributed by slots](../guide/components.html#Content-Distribution-with-Slots). Each [named slot](../guide/components.html#Named-Slots) has its own corresponding property (e.g. the contents of `slot="foo"` will be found at `vm.$slots.foo`). The `default` property contains any nodes not included in a named slot.
939+
Used to programmatically access content [distributed by slots](../guide/components.html#Content-Distribution-with-Slots). Each [named slot](../guide/components.html#Named-Slots) has its own corresponding property (e.g. the contents of `slot="foo"` will be found at `vm.$slots.foo`). The `default` property contains any nodes not included in a named slot.
938940

939941
Accessing `vm.$slots` is most useful when writing a component with a [render function](../guide/render-function.html).
940942

@@ -972,9 +974,28 @@ All lifecycle hooks automatically have their `this` context bound to the instanc
972974
```
973975

974976
- **See also:**
975-
- [`<slot>` Component](#slot)
977+
- [`<slot>` Component](#slot-1)
976978
- [Content Distribution with Slots](../guide/components.html#Content-Distribution-with-Slots)
977-
- [Render Functions](../guide/render-function.html)
979+
- [Render Functions: Slots](../guide/render-function.html#Slots)
980+
981+
### vm.$scopedSlots
982+
983+
> New in 2.1.0
984+
985+
- **Type:** `{ [name: string]: props => VNode | Array<VNode> }`
986+
987+
- **Read only**
988+
989+
- **Details:**
990+
991+
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.
992+
993+
Accessing `vm.$scopedSlots` is most useful when writing a component with a [render function](../guide/render-function.html).
994+
995+
- **See also:**
996+
- [`<slot>` Component](#slot-1)
997+
- [Scoped Slots](../guide/components.html#Scoped-Slots)
998+
- [Render Functions: Slots](../guide/render-function.html#Slots)
978999

9791000
### vm.$refs
9801001

@@ -1200,15 +1221,17 @@ All lifecycle hooks automatically have their `this` context bound to the instanc
12001221

12011222
Force the Vue instance to re-render. Note it does not affect all child components, only the instance itself and child components with inserted slot content.
12021223

1203-
<h3 id="vm-nextTick">vm.$nextTick( callback )</h3>
1224+
<h3 id="vm-nextTick">vm.$nextTick( [callback] )</h3>
12041225

12051226
- **Arguments:**
1206-
- `{Function} callback`
1227+
- `{Function} [callback]`
12071228

12081229
- **Usage:**
12091230

12101231
Defer the callback to be executed after the next DOM update cycle. Use it immediately after you've changed some data to wait for the DOM update. This is the same as the global `Vue.nextTick`, except that the callback's `this` context is automatically bound to the instance calling this method.
12111232

1233+
> New in 2.1.0: returns a Promise if no callback is provided and Promise is supported in the execution environment.
1234+
12121235
- **Example:**
12131236

12141237
``` js
@@ -1283,39 +1306,39 @@ All lifecycle hooks automatically have their `this` context bound to the instanc
12831306
```
12841307
- **See also:** [Data Binding Syntax - interpolations](../guide/syntax.html#Raw-HTML)
12851308

1286-
### v-if
1309+
### v-show
12871310

12881311
- **Expects:** `any`
12891312

12901313
- **Usage:**
12911314

1292-
Conditionally render the elementbased on the truthy-ness of the expression value. The element and its contained directives / components are destroyed and re-constructed during toggles. If the element is a `<template>` element, its content will be extracted as the conditional block.
1315+
Toggle's the element's `display` CSS property based on the truthy-ness of the expression value.
12931316

12941317
This directive triggers transitions when its condition changes.
12951318

1296-
- **See also:** [Conditional Rendering - v-if](../guide/conditional.html)
1319+
- **See also:** [Conditional Rendering - v-show](../guide/conditional.html#v-show)
12971320

1298-
### v-show
1321+
### v-if
12991322

13001323
- **Expects:** `any`
13011324

13021325
- **Usage:**
13031326

1304-
Toggle's the element's `display` CSS property based on the truthy-ness of the expression value.
1327+
Conditionally render the elementbased on the truthy-ness of the expression value. The element and its contained directives / components are destroyed and re-constructed during toggles. If the element is a `<template>` element, its content will be extracted as the conditional block.
13051328

13061329
This directive triggers transitions when its condition changes.
13071330

1308-
- **See also:** [Conditional Rendering - v-show](../guide/conditional.html#v-show)
1331+
- **See also:** [Conditional Rendering - v-if](../guide/conditional.html)
13091332

13101333
### v-else
13111334

13121335
- **Does not expect expression**
13131336

1314-
- **Restriction:** previous sibling element must have `v-if`.
1337+
- **Restriction:** previous sibling element must have `v-if` or `v-else-if`.
13151338

13161339
- **Usage:**
13171340

1318-
Denote the "else block" for `v-if`.
1341+
Denote the "else block" for `v-if` or a `v-if`/`v-else-if` chain.
13191342

13201343
```html
13211344
<div v-if="Math.random() > 0.5">
@@ -1329,6 +1352,35 @@ All lifecycle hooks automatically have their `this` context bound to the instanc
13291352
- **See also:**
13301353
- [Conditional Rendering - v-else](../guide/conditional.html#v-else)
13311354

1355+
### v-else-if
1356+
1357+
> New in 2.1.0
1358+
1359+
- **Expects:** `any`
1360+
1361+
- **Restriction:** previous sibling element must have `v-if` or `v-else-if`.
1362+
1363+
- **Usage:**
1364+
1365+
Denote the "else if block" for `v-if`. Can be chained.
1366+
1367+
```html
1368+
<div v-if="type === 'A'">
1369+
A
1370+
</div>
1371+
<div v-else-if="type === 'B'">
1372+
B
1373+
</div>
1374+
<div v-else-if="type === 'C'">
1375+
C
1376+
</div>
1377+
<div v-else>
1378+
Not A/B/C
1379+
</div>
1380+
```
1381+
1382+
- **See also:** [Conditional Rendering - v-else-if](../guide/conditional.html#v-else-if)
1383+
13321384
### v-for
13331385

13341386
- **Expects:** `Array | Object | number | string`
@@ -1445,7 +1497,8 @@ All lifecycle hooks automatically have their `this` context bound to the instanc
14451497
- **Argument:** `attrOrProp (optional)`
14461498

14471499
- **Modifiers:**
1448-
- `.prop` - Used for binding DOM attributes.
1500+
- `.prop` - Bind as a DOM property instead of an attribute. ([what's the difference?](http://stackoverflow.com/questions/6003819/properties-and-attributes-in-html#answer-6004028))
1501+
- `.camel` - transform the kebab-case attribute name into camelCase. (supported since 2.1.0)
14491502

14501503
- **Usage:**
14511504

@@ -1488,6 +1541,14 @@ All lifecycle hooks automatically have their `this` context bound to the instanc
14881541
<svg><a :xlink:special="foo"></a></svg>
14891542
```
14901543

1544+
The `.camel` modifier allows camelizing a `v-bind` attribute name when using in-DOM templates, e.g. the SVG `viewBox` attribute:
1545+
1546+
``` html
1547+
<svg :view-box.camel="viewBox"></svg>
1548+
```
1549+
1550+
`.camel` is not needed if you are using string templates, or compiling with `vue-loader`/`vueify`.
1551+
14911552
- **See also:**
14921553
- [Class and Style Bindings](../guide/class-and-style.html)
14931554
- [Components - Component Props](../guide/components.html#Props)
@@ -1505,7 +1566,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc
15051566
- **Modifiers:**
15061567
- [`.lazy`](../guide/forms.html#lazy) - listen to `change` events instead of `input`
15071568
- [`.number`](../guide/forms.html#number) - cast input string to numbers
1508-
- [`.trim`](/guild/forms.html#trim) - trim input
1569+
- [`.trim`](../guide/forms.html#trim) - trim input
15091570

15101571
- **Usage:**
15111572

@@ -1760,6 +1821,10 @@ All lifecycle hooks automatically have their `this` context bound to the instanc
17601821

17611822
### keep-alive
17621823

1824+
- **Props:**
1825+
- `include` - string or RegExp. Only components matched by this will be cached.
1826+
- `exclude` - string or RegExp. Any component matched by this will not be cached.
1827+
17631828
- **Usage:**
17641829

17651830
When wrapped around a dynamic component, `<keep-alive>` caches the inactive component instances without destroying them. Similar to `<transition>`, `<keep-alive>` is an abstract component: it doesn't render a DOM element itself, and doesn't show up in the component parent chain.
@@ -1788,6 +1853,26 @@ All lifecycle hooks automatically have their `this` context bound to the instanc
17881853
</transition>
17891854
```
17901855

1856+
- **`include` and `exclude`**
1857+
1858+
> New in 2.1.0
1859+
1860+
The `include` and `exclude` props allow components to be conditionally cached. Both props can either be a comma-delimited string or a RegExp:
1861+
1862+
``` html
1863+
<!-- comma-delimited string -->
1864+
<keep-alive include="a,b">
1865+
<component :is="view"></component>
1866+
</keep-alive>
1867+
1868+
<!-- regex (use v-bind) -->
1869+
<keep-alive :include="/a|b/">
1870+
<component :is="view"></component>
1871+
</keep-alive>
1872+
```
1873+
1874+
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.
1875+
17911876
<p class="tip">`<keep-alive>` does not work with functional components because they do not have instances to be cached.</p>
17921877

17931878
- **See also:** [Dynamic Components - keep-alive](../guide/components.html#keep-alive)

‎src/v2/guide/comparison.md‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,6 @@ If you're feeling lazy though, below are the numbers from one run in Chrome 52 o
7777
<td>343ms</td>
7878
<td>453ms</td>
7979
</tr>
80-
</tr>
8180
</tbody>
8281
</table>
8382
{% endraw %}
@@ -90,7 +89,7 @@ This means updates in unoptimized Vue will be much faster than unoptimized React
9089

9190
#### In Development
9291

93-
While performance in production is the more important metrics as it is directly associated with end-user experience, performance in development still matters because it is associated with the developer experience.
92+
While performance in production is the more important metric as it is directly associated with end-user experience, performance in development still matters because it is associated with the developer experience.
9493

9594
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.
9695

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /