falsy 是什麼 - daniel-qa/Vue GitHub Wiki
Falsy 是「看起來像假的東西」,JavaScript 看到就會當成 false 來處理。
在 JavaScript 裡,可以當作 false 來用的值,就叫做 falsy。
- 常見的 falsy 值有哪些?
這些值在邏輯判斷時,會被當作 false:
false
0
''(空字串)
null
undefined
NaN(不是一個數)
- 範例:
v-if 可以處理 fasly 的情況
v-if 判斷 notShowID_Tag 不存在的情況,視為 flasy
<template v-if="!item.notShowID_Tag">
{{ item.scCnt }} 校 {{ item.tchCnt }} 人
</template>
為什麼這樣寫超剛好?
notShowID_Tag 預設是 undefined(falsy),所以會顯示。
只有加了 notShowID_Tag: true 的那一項,才會被隱藏。
其他項目不用改,不會受影響
< template> 是 Vue 專用的虛擬元素,它完全不會渲染成 DOM 元素,也就是說:
-
不會影響樣式排版(因為根本不會出現在瀏覽器裡)
-
不會有 margin、padding、display 等 CSS 問題
-
可用來包條件邏輯 (v-if, v-for) 而不多產生一層標籤