久久96国产精品久久久-久久发布国产伦子伦精品-久久精品国产精品青草-久久天天躁夜夜躁狠狠85麻豆

技術員聯盟提供win764位系統下載,win10,win7,xp,裝機純凈版,64位旗艦版,綠色軟件,免費軟件下載基地!

當前位置:主頁 > 教程 > 服務器類 >

VUE元素的隱藏和顯示(v-show指令)教程

來源:技術員聯盟┆發布時間:2017-07-12 12:43┆點擊:

除了click單擊事件,還有mouseover,mouseover等鼠標事件。 

dbclick雙擊事件。

v-on:click/mouseover/mouseover/mousedown/dbclick/...

v-show指令

v-show="true/false" //控制元素顯示/隱藏

示例代碼:

<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> <script src=http://www.3lian.com/edu/2017/06-24/"http:/unpkg.com/vue/dist/vue.js"></script> <script type="text/javascript"> window.onload = function(){ var vm = new Vue({ el:'#box', data:{ isShow:false, }, methods:{ toggle:function(){ this.isShow = !this.isShow; } } }); } </script> </head> <body> <div id="box"> <input type="button" value="toggle" v-on:click="toggle()"> <br /> <div v-show="isShow" style="width: 100px;height: 100px;background: red"></div> </div> </body> </html>

VUE元素的隱藏和顯示(v-show指令)教程 三聯