iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 11
0
自我挑戰組

使用Vue製作簡單的 WorkBoard (30天)系列 第 11

(第十一天)自我學習 - 都有 v-if 為什麼還要有 v-show

v-show 使用

v-show 很簡單跟 v-if 使用起來一樣


//建立一個變數,利用觸發按鈕的方式來讓變數切換
data: {
    result: true
},
methods: {
    btnClick: function(){
        this.result = !this.result;
    },
},

id = 'myApp' 裡面新增標籤

<h1 v-show="result">為什麼需要 show?</h1>
<button @click="btnClick">按鈕</button>

新增完後這樣就可以看到按按鈕之後會消失出現,可是這樣v-ifv-show 有什麼樣的差別呢?

v-if 在設置html DOM中會消失,v-show 在設置html DOM中不會消失,只是隱藏起來而已。

趕快去試試看吧!


上一篇
(第十天)自我學習 - v-if v-else-if v-else
下一篇
(第十二天)自我學習 - Vue checkbox 複選
系列文
使用Vue製作簡單的 WorkBoard (30天)24
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言