一甩挫、 條件渲染
1、條件渲染指令是做什么的椿每?有哪些常見的條件渲染語句伊者?
- 在某些情況下,我們需要根據(jù)當(dāng)前的條件決定某些元素或組件是否渲染间护,這個(gè)時(shí)候我們就需要進(jìn)行條件判斷了亦渗。
- 條件渲染語句:v-if、v-show
image.png
image.png
2汁尺、 v-if 和 v-show 渲染上的區(qū)別法精? 使用上有什么區(qū)別?
- v-if 會(huì)將元素從 dom 樹上擦除
- v-show 僅僅是將元素的 display=none痴突,進(jìn)行元素隱藏
image.png
image.png
3搂蜓、因?yàn)?v-if 是一個(gè)模板指令,所以必須有一個(gè)標(biāo)簽作為載體辽装,如果我們希望多個(gè)元素同時(shí)切換帮碰,要怎么設(shè)計(jì)比較好?
image.png
image.png
二拾积、 列表渲染
1殉挽、列表渲染通常需要借助那個(gè)指令丰涉?
- v-for 指令
image.png
2、v-for 的基本使用此再?
image.png
image.png
3昔搂、v-for 什么情況下和 template 一起使用?
image.png
4输拇、Vue 能監(jiān)聽到哪些變更數(shù)組的方法摘符?
image.png
5、什么是 VNode策吠?
image.png
6逛裤、什么是 VDom?
- VNode === Virtual Node 是一個(gè)虛擬節(jié)點(diǎn)
- VDom === Virtual Dom 是多個(gè) VNode 形成的樹結(jié)構(gòu)
-
虛擬 dom 最大的好處猴抹,就是方便跨平臺(tái)渲染
image.png
7带族、v-for 中的 key 是什么作用?
image.png
8蟀给、插入 F 的案例蝙砌,好好練習(xí)理解
image.png
9、Vue 對(duì)于v-for 【沒有key】 的 diff 流程跋理?
image.png
image.png
10择克、Vue 對(duì)于v-for【有key】 的 diff 流程?
image.png
image.png
image.png
image.png