預(yù)期：number | string
key?的特殊屬性主要用在 Vue 的虛擬 DOM 算法蛙卤，在新舊 nodes 對(duì)比時(shí)辨識(shí) VNodes惑惶。如果不使用 key矾削，Vue 會(huì)使用一種最大限度減少動(dòng)態(tài)元素并且盡可能的嘗試就地修改/復(fù)用相同類型元素的算法萎津。而使用 key 時(shí)咧七，它會(huì)基于 key 的變化重新排列元素順序廊营，并且會(huì)移除 key 不存在的元素歪泳。
有相同父元素的子元素必須有獨(dú)特的 key。重復(fù)的 key 會(huì)造成渲染錯(cuò)誤露筒。
最常見(jiàn)的用例是結(jié)合?v-for：
- ...
它也可以用于強(qiáng)制替換元素/組件而不是重復(fù)使用它呐伞。當(dāng)你遇到如下場(chǎng)景時(shí)它可能會(huì)很有用：
完整地觸發(fā)組件的生命周期鉤子
觸發(fā)過(guò)渡
例如：
{{ text }}
當(dāng)?text?發(fā)生改變時(shí)，<span>?總是會(huì)被替換而不是被修改邀窃，因此會(huì)觸發(fā)過(guò)渡荸哟。
預(yù)期：string
ref?被用來(lái)給元素或子組件注冊(cè)引用信息。引用信息將會(huì)注冊(cè)在父組件的?$refs?對(duì)象上瞬捕。如果在普通的 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 注冊(cè)時(shí)間的重要說(shuō)明：因?yàn)?ref 本身是作為渲染結(jié)果被創(chuàng)建的扇救，在初始渲染的時(shí)候你不能訪問(wèn)它們 - 它們還不存在刑枝！$refs?也不是響應(yīng)式的，因此你不應(yīng)該試圖用它在模板中做數(shù)據(jù)綁定迅腔。
參考：子組件引用
預(yù)期：string | Object (組件的選項(xiàng)對(duì)象)
用于動(dòng)態(tài)組件且基于?DOM 內(nèi)模板的限制來(lái)工作装畅。
示例：
<!-- 當(dāng) `currentView` 改變時(shí)，組件也跟著改變 --><!-- 這樣做是有必要的沧烈，因?yàn)?`<my-row>` 放在一個(gè) --><!-- `<table>` 內(nèi)可能無(wú)效且被放置到外面 -->
更多的使用細(xì)節(jié)掠兄，請(qǐng)移步至下面的鏈接。
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?的值解幼，來(lái)決定哪個(gè)組件被渲染。
<!-- 動(dòng)態(tài)組件由 vm 實(shí)例的屬性值 `componentId` 控制 --><!-- 也能夠渲染注冊(cè)過(guò)的組件或 prop 傳入的組件 -->
Props：
name?- string包警，用于自動(dòng)生成 CSS 過(guò)渡類名撵摆。例如：name: 'fade'?將自動(dòng)拓展為.fade-enter，.fade-enter-active等害晦。默認(rèn)類名為?"v"
appear?- boolean特铝，是否在初始渲染時(shí)使用過(guò)渡。默認(rèn)為?false壹瘟。
css?- boolean鲫剿，是否使用 CSS 過(guò)渡類。默認(rèn)為?true稻轨。如果設(shè)置為?false灵莲，將只通過(guò)組件事件觸發(fā)注冊(cè)的 JavaScript 鉤子。
type?- string殴俱，指定過(guò)渡事件類型政冻，偵聽(tīng)過(guò)渡何時(shí)結(jié)束。有效值為?"transition"?和?"animation"线欲。默認(rèn) Vue.js 將自動(dòng)檢測(cè)出持續(xù)時(shí)間長(zhǎng)的為過(guò)渡事件類型明场。
mode?- string，控制離開(kāi)/進(jìn)入過(guò)渡的時(shí)間序列李丰。有效的模式有?"out-in"?和?"in-out"苦锨；默認(rèn)同時(shí)進(jìn)行。
duration?- number | {?enter: number,?leave: number } 指定過(guò)渡的持續(xù)時(shí)間。默認(rèn)情況下逆屡，Vue 會(huì)等待過(guò)渡所在根元素的第一個(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è)元素/組件的過(guò)渡效果。<transition>?只會(huì)把過(guò)渡效果應(yīng)用到其包裹的內(nèi)容上魏蔗，而不會(huì)額外渲染 DOM 元素砍的，也不會(huì)出現(xiàn)在可被檢查的組件層級(jí)中。
<!-- 簡(jiǎn)單元素 -->toggled content<!-- 動(dòng)態(tài)組件 --><!-- 事件鉤子 -->toggled content
newVue({? ...? methods: {transitionComplete:function(el){// 傳入 'el' 這個(gè) DOM 元素作為參數(shù)莺治。}? }? ...}).$mount('#transition-demo')
參考：過(guò)渡：進(jìn)入廓鞠，離開(kāi)和列表
Props：
tag?- string，默認(rèn)為?span
move-class?- 覆蓋移動(dòng)過(guò)渡期間應(yīng)用的 CSS 類谣旁。
除了?mode床佳，其他特性和?<transition>?相同。
事件：
事件和?<transition>?相同榄审。
用法：
<transition-group>?元素作為多個(gè)元素/組件的過(guò)渡效果砌们。<transition-group>?渲染一個(gè)真實(shí)的 DOM 元素。默認(rèn)渲染?<span>搁进，可以通過(guò)?tag?屬性配置哪個(gè)元素應(yīng)該被渲染浪感。
注意，每個(gè)?<transition-group>?的子節(jié)點(diǎn)必須有?獨(dú)立的 key?饼问，動(dòng)畫才能正常工作
<transition-group>?支持通過(guò) CSS transform 過(guò)渡移動(dòng)影兽。當(dāng)一個(gè)子節(jié)點(diǎn)被更新，從屏幕上的位置發(fā)生變化莱革，它會(huì)被應(yīng)用一個(gè)移動(dòng)中的 CSS 類 (通過(guò)?name?屬性或配置?move-class?屬性自動(dòng)生成)峻堰。如果 CSS?transform?屬性是“可過(guò)渡”屬性，當(dāng)應(yīng)用移動(dòng)類時(shí)盅视，將會(huì)使用?FLIP 技術(shù)?使元素流暢地到達(dá)動(dòng)畫終點(diǎn)捐名。
{{ item.text }}
Props：
include?- 字符串或正則表達(dá)式左冬。只有名稱匹配的組件會(huì)被緩存桐筏。
exclude?- 字符串或正則表達(dá)式。任何名稱匹配的組件都不會(huì)被緩存拇砰。
max?- 數(shù)字梅忌。最多可以緩存多少組件實(shí)例。
用法：
<keep-alive>?包裹動(dòng)態(tài)組件時(shí)除破，會(huì)緩存不活動(dòng)的組件實(shí)例牧氮，而不是銷毀它們。和?<transition>?相似瑰枫，<keep-alive>?是一個(gè)抽象組件：它自身不會(huì)渲染一個(gè) DOM 元素踱葛，也不會(huì)出現(xiàn)在組件的父組件鏈中丹莲。
當(dāng)組件在?<keep-alive>?內(nèi)被切換，它的?activated?和?deactivated?這兩個(gè)生命周期鉤子函數(shù)將會(huì)被對(duì)應(yīng)執(zhí)行尸诽。
在 2.2.0 及其更高版本中甥材，activated?和?deactivated?將會(huì)在?<keep-alive>?樹(shù)內(nèi)的所有嵌套組件中觸發(fā)。
主要用于保留組件狀態(tài)或避免重新渲染性含。
<!-- 基本 --><!-- 多個(gè)條件判斷的子組件 --><!-- 和 `<transition>` 一起使用 -->
注意洲赵，<keep-alive>?是用在其一個(gè)直屬的子組件被開(kāi)關(guān)的情形。如果你在其中有?v-for?則不會(huì)工作商蕴。如果有上述的多個(gè)條件性的子元素叠萍，<keep-alive>?要求同時(shí)只有一個(gè)子元素被渲染。
include?and?exclude
2.1.0 新增
include?和?exclude?屬性允許組件有條件地緩存绪商。二者都可以用逗號(hào)分隔字符串苛谷、正則表達(dá)式或一個(gè)數(shù)組來(lái)表示：
<!-- 逗號(hào)分隔字符串 --><!-- 正則表達(dá)式 (使用 `v-bind`) --><!-- 數(shù)組 (使用 `v-bind`) -->
匹配首先檢查組件自身的?name?選項(xiàng)，如果?name?選項(xiàng)不可用格郁，則匹配它的局部注冊(cè)名稱 (父組件?components?選項(xiàng)的鍵值)腹殿。匿名組件不能被匹配。
max
2.5.0 新增
最多可以緩存多少組件實(shí)例例书。一旦這個(gè)數(shù)字達(dá)到了赫蛇，在新實(shí)例被創(chuàng)建之前，已緩存組件中最久沒(méi)有被訪問(wèn)的實(shí)例會(huì)被銷毀掉雾叭。
<keep-alive>?不會(huì)在函數(shù)式組件中正常工作，因?yàn)樗鼈儧](méi)有緩存實(shí)例落蝙。
參考：動(dòng)態(tài)組件 - keep-alive
Props：
name?- string织狐，用于命名插槽。
Usage：
<slot>?元素作為組件模板之中的內(nèi)容分發(fā)插槽筏勒。<slot>?元素自身將被替換移迫。
詳細(xì)用法，請(qǐng)參考下面教程的鏈接管行。
