預(yù)期：number | string
key?的特殊屬性主要用在 Vue 的虛擬 DOM 算法，在新舊 nodes 對比時(shí)辨識 VNodes。如果不使用 key，Vue 會使用一種最大限度減少動(dòng)態(tài)元素并且盡可能的嘗試就地修改/復(fù)用相同類型元素的算法。而使用 key 時(shí)，它會基于 key 的變化重新排列元素順序，并且會移除 key 不存在的元素。
有相同父元素的子元素必須有獨(dú)特的 key。重復(fù)的 key 會造成渲染錯(cuò)誤。
最常見的用例是結(jié)合?v-for：
- ...
它也可以用于強(qiáng)制替換元素/組件而不是重復(fù)使用它。當(dāng)你遇到如下場景時(shí)它可能會很有用：
完整地觸發(fā)組件的生命周期鉤子
觸發(fā)過渡
例如：
{{ text }}
當(dāng)?text?發(fā)生改變時(shí)，<span>?總是會被替換而不是被修改，因此會觸發(fā)過渡。
預(yù)期：string
ref?被用來給元素或子組件注冊引用信息。引用信息將會注冊在父組件的?$refs?對象上。如果在普通的 DOM 元素上使用，引用指向的就是 DOM 元素；如果用在子組件上，引用就指向組件實(shí)例：
<!-- `vm.$refs.p` will be the DOM node -->hello<!-- `vm.$refs.child` will be the child component instance -->
當(dāng)?v-for?用于元素或組件的時(shí)候，引用信息將是包含 DOM 節(jié)點(diǎn)或組件實(shí)例的數(shù)組。
關(guān)于 ref 注冊時(shí)間的重要說明：因?yàn)?ref 本身是作為渲染結(jié)果被創(chuàng)建的，在初始渲染的時(shí)候你不能訪問它們 - 它們還不存在！$refs?也不是響應(yīng)式的，因此你不應(yīng)該試圖用它在模板中做數(shù)據(jù)綁定。
參考：子組件引用
預(yù)期：string | Object (組件的選項(xiàng)對象)
用于動(dòng)態(tài)組件且基于?DOM 內(nèi)模板的限制來工作。
示例：
<!-- 當(dāng) `currentView` 改變時(shí)，組件也跟著改變 --><!-- 這樣做是有必要的，因?yàn)?`<my-row>` 放在一個(gè) --><!-- `<table>` 內(nèi)可能無效且被放置到外面 -->
更多的使用細(xì)節(jié)，請移步至下面的鏈接。
See also：
推薦 2.6.0 新增的?v-slot。
預(yù)期：string
用于標(biāo)記往哪個(gè)具名插槽中插入子組件內(nèi)容。
參考：具名插槽
推薦 2.6.0 新增的?v-slot。
預(yù)期：function argument expression
用法：
用于將元素或組件表示為作用域插槽。特性的值應(yīng)該是可以出現(xiàn)在函數(shù)簽名的參數(shù)位置的合法的 JavaScript 表達(dá)式。這意味著在支持的環(huán)境中，你還可以在表達(dá)式中使用 ES2015 解構(gòu)。它在 2.5.0+ 中替代了?scope。
此屬性不支持動(dòng)態(tài)綁定。
參考：作用域插槽
被 2.5.0 新增的?slot-scope?取代。推薦 2.6.0 新增的?v-slot。
用于表示一個(gè)作為帶作用域的插槽的?<template>?元素，它在 2.5.0+ 中被?slot-scope?替代。
用法：
除了?scope?只可以用于?<template>?元素，其它和?slot-scope?都相同。
Props：
is?- string | ComponentDefinition | ComponentConstructor
inline-template?- boolean
用法：
渲染一個(gè)“元組件”為動(dòng)態(tài)組件。依?is?的值，來決定哪個(gè)組件被渲染。
<!-- 動(dòng)態(tài)組件由 vm 實(shí)例的屬性值 `componentId` 控制 --><!-- 也能夠渲染注冊過的組件或 prop 傳入的組件 -->
Props：
name?- string，用于自動(dòng)生成 CSS 過渡類名。例如：name: 'fade'?將自動(dòng)拓展為.fade-enter，.fade-enter-active等。默認(rèn)類名為?"v"
appear?- boolean，是否在初始渲染時(shí)使用過渡。默認(rèn)為?false。
css?- boolean，是否使用 CSS 過渡類。默認(rèn)為?true。如果設(shè)置為?false，將只通過組件事件觸發(fā)注冊的 JavaScript 鉤子。
type?- string，指定過渡事件類型，偵聽過渡何時(shí)結(jié)束。有效值為?"transition"?和?"animation"。默認(rèn) Vue.js 將自動(dòng)檢測出持續(xù)時(shí)間長的為過渡事件類型。
mode?- string，控制離開/進(jìn)入過渡的時(shí)間序列。有效的模式有?"out-in"?和?"in-out"；默認(rèn)同時(shí)進(jìn)行。
duration?- number | {?enter: number,?leave: number } 指定過渡的持續(xù)時(shí)間。默認(rèn)情況下，Vue 會等待過渡所在根元素的第一個(gè)?transitionend?或?animationend?事件。
enter-class?- string
leave-class?- string
appear-class?- string
enter-to-class?- string
leave-to-class?- string
appear-to-class?- string
enter-active-class?- string
leave-active-class?- string
appear-active-class?- string
事件：
before-enter
before-leave
before-appear
enter
leave
appear
after-enter
after-leave
after-appear
enter-cancelled
leave-cancelled?(v-show?only)
appear-cancelled
用法：
<transition>?元素作為單個(gè)元素/組件的過渡效果。<transition>?只會把過渡效果應(yīng)用到其包裹的內(nèi)容上，而不會額外渲染 DOM 元素，也不會出現(xiàn)在可被檢查的組件層級中。
<!-- 簡單元素 -->toggled content<!-- 動(dòng)態(tài)組件 --><!-- 事件鉤子 -->toggled content
newVue({? ...? methods: {transitionComplete:function(el){// 傳入 'el' 這個(gè) DOM 元素作為參數(shù)。}? }? ...}).$mount('#transition-demo')
Props：
tag?- string，默認(rèn)為?span
move-class?- 覆蓋移動(dòng)過渡期間應(yīng)用的 CSS 類。
除了?mode，其他特性和?<transition>?相同。
事件：
事件和?<transition>?相同。
用法：
<transition-group>?元素作為多個(gè)元素/組件的過渡效果。<transition-group>?渲染一個(gè)真實(shí)的 DOM 元素。默認(rèn)渲染?<span>，可以通過?tag?屬性配置哪個(gè)元素應(yīng)該被渲染。
注意，每個(gè)?<transition-group>?的子節(jié)點(diǎn)必須有?獨(dú)立的 key?，動(dòng)畫才能正常工作
<transition-group>?支持通過 CSS transform 過渡移動(dòng)。當(dāng)一個(gè)子節(jié)點(diǎn)被更新，從屏幕上的位置發(fā)生變化，它會被應(yīng)用一個(gè)移動(dòng)中的 CSS 類 (通過?name?屬性或配置?move-class?屬性自動(dòng)生成)。如果 CSS?transform?屬性是“可過渡”屬性，當(dāng)應(yīng)用移動(dòng)類時(shí)，將會使用?FLIP 技術(shù)?使元素流暢地到達(dá)動(dòng)畫終點(diǎn)。
{{ item.text }}
Props：
include?- 字符串或正則表達(dá)式。只有名稱匹配的組件會被緩存。
exclude?- 字符串或正則表達(dá)式。任何名稱匹配的組件都不會被緩存。
max?- 數(shù)字。最多可以緩存多少組件實(shí)例。
用法：
<keep-alive>?包裹動(dòng)態(tài)組件時(shí)，會緩存不活動(dòng)的組件實(shí)例，而不是銷毀它們。和?<transition>?相似，<keep-alive>?是一個(gè)抽象組件：它自身不會渲染一個(gè) DOM 元素，也不會出現(xiàn)在組件的父組件鏈中。
當(dāng)組件在?<keep-alive>?內(nèi)被切換，它的?activated?和?deactivated?這兩個(gè)生命周期鉤子函數(shù)將會被對應(yīng)執(zhí)行。
在 2.2.0 及其更高版本中，activated?和?deactivated?將會在?<keep-alive>?樹內(nèi)的所有嵌套組件中觸發(fā)。
主要用于保留組件狀態(tài)或避免重新渲染。
<!-- 基本 --><!-- 多個(gè)條件判斷的子組件 --><!-- 和 `<transition>` 一起使用 -->
注意，<keep-alive>?是用在其一個(gè)直屬的子組件被開關(guān)的情形。如果你在其中有?v-for?則不會工作。如果有上述的多個(gè)條件性的子元素，<keep-alive>?要求同時(shí)只有一個(gè)子元素被渲染。
include?and?exclude
2.1.0 新增
include?和?exclude?屬性允許組件有條件地緩存。二者都可以用逗號分隔字符串、正則表達(dá)式或一個(gè)數(shù)組來表示：
<!-- 逗號分隔字符串 --><!-- 正則表達(dá)式 (使用 `v-bind`) --><!-- 數(shù)組 (使用 `v-bind`) -->
匹配首先檢查組件自身的?name?選項(xiàng)，如果?name?選項(xiàng)不可用，則匹配它的局部注冊名稱 (父組件?components?選項(xiàng)的鍵值)。匿名組件不能被匹配。
max
2.5.0 新增
最多可以緩存多少組件實(shí)例。一旦這個(gè)數(shù)字達(dá)到了，在新實(shí)例被創(chuàng)建之前，已緩存組件中最久沒有被訪問的實(shí)例會被銷毀掉。
<keep-alive>?不會在函數(shù)式組件中正常工作，因?yàn)樗鼈儧]有緩存實(shí)例。
參考：動(dòng)態(tài)組件 - keep-alive
Props：
name?- string，用于命名插槽。
Usage：
<slot>?元素作為組件模板之中的內(nèi)容分發(fā)插槽。<slot>?元素自身將被替換。
詳細(xì)用法，請參考下面教程的鏈接。
