vue3——v-show

weixin_34007020發表於2017-05-14
Vue

v-show

  1. 作用：通過判斷，是否顯示該內容。如果值為true，則顯示。否則就隱藏。
  2. 語法：v-show=”判斷表示式”
  3. 特點：元素會始終渲染在DOM中，只是被設定了display:none
  4. 舉個栗子
    <div id="app">
    <p v-show="seen">show and hide</p>
    </div>
    var app = new Vue({
    el : '#app',
    data : {
    seen : true
    }
    })
    執行結果 ：
    5627750-b173b66ae3723fe9.gif

從中我們可以看出 ：

v-show與否通過內聯樣式display：none來體現
這裡可以給seen賦任何值，瀏覽器會根據轉化後的值來判斷是否顯示
其中空陣列和空物件會顯示，undefined，null，0會隱藏，1等也會顯示

5627750-826a0f683962a89c.gif

相關文章