推薦用以下方式引入組件
is引入組件，實(shí)現(xiàn)動(dòng)態(tài)組件
image.png
動(dòng)態(tài)組件，修改data里面comtorender的值，可以引入不同的組件
image.png
父子組件之間的通信
父向子組件傳遞一個(gè)屬性number
image.png
子組件通過props選項(xiàng)聲明number
屬性大小寫不敏感，所以不能用駝峰的方法，用中線
image.png
props：數(shù)組，字符串
指定傳值類型是number或者string
image.png
父組件傳遞的是變量
image.png
image.png
子組件向父組件傳遞信息時(shí)，通過觸發(fā)事件，事件名不支持駝峰寫法，用中線
插槽功能： slot標(biāo)簽，父向子組件傳遞模板
父組件在子組件內(nèi)增加了一個(gè)p標(biāo)簽
子組件
子組件通過slot接收
image.png
更復(fù)雜的情況
image.png
image.png
keep-alive內(nèi)置標(biāo)簽，緩存組件，提高加載速度
image.png
實(shí)現(xiàn)動(dòng)態(tài)組件的兩種方法：is或者v-bind
總結(jié)
image.png
vue-高級(jí)功能
image.png
過渡-動(dòng)畫效果（css過渡或者js過渡）
通過4個(gè)類名實(shí)現(xiàn)css過渡
image.png
transition標(biāo)簽
定義name屬性的名稱：比如fade
image.png
再為不同的階段定義不同的樣式
image.png
transform控制位置變化
三種模式v-show，v-if，is動(dòng)態(tài)組件
多元素過渡，transition標(biāo)簽?zāi)J(rèn)in-out模式，先進(jìn)新的元素，后出舊的元素，通過mode可以控制動(dòng)畫展示過程
image.png
注意：多元素，如果是相同標(biāo)簽，那么不展示動(dòng)畫效果，必須通過key屬性來區(qū)分
image.png
