1 v for和v if的優先順序哪個更高

2021-10-12 17:23:07 字數 1171 閱讀 8243

<

!doctype html>

vue事件處理<

/title>

<

/head>

"demo"

>

v-for和v-

if誰的優先順序高?應該如何正確使用避免效能問題?<

/h1>

for=

"child in children" v-if=

"isfolder"

>

}<

/p>

<

/div>

"vue.js"

>

<

/script>

// 建立例項

newvue(,

,]}}

, computed:},

}); console.

log;

<

/script>

<

/body>

<

/html>

同級時渲染函式

(

function

anonymous()

},[_c

('h1',[

_v("v-for和v-if誰的優先順序高?應該如何正確使用避免效能問題?")]

),_v(

" "),_l

((children)

,function

(child))]

,2)}

})

外層為v-if內層為v-for渲染函式

(

function

anonymous()

},[_c

('h1',[

_v("v-for和v-if誰的優先順序高?應該如何正確使用避免效能問題?")]

),_v(

" "),_v

("\n "),

(isfolder)?[

_v("\n "),

_l((children)

,function

(child))]

:+_e(

)],2

)}})

v-for的優先順序比較高

v for和v if優先順序

原始碼位置vue src complier codegen index.js function genelement el astelement,state codegenstate string if el.staticroot el.staticprocessed else if el.once...

v if 和v for的優先順序

當v if與v for一起使用時,v for具有比v if更高的優先順序,這意味著v if將分別重複執行於每個v for迴圈中 所以,不推薦v if和v for同時使用 for user in activeusers key user.id li ul 或者 shouldshowusers for ...

v for與v if的優先順序

一般我們在兩種常見的情況下會傾向於這樣做 詳解當 vue 處理指令時,v for比v if具有更高的優先順序,所以這個模板 v for user in users v if user.isactive key user.id li ul 將會經過如下運算 this.users.map functio...