标签：创建元素 var init 性能 http html src cal inpu
1 <html lang="en"> 2 <head> 3 <meta charset="UTF-8"> 4 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 5 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 6 <title>v-if 和v-show</title> 7 <script src="../js/vue.js"></script> 8 </head> 9 <body> 10 <div id="app"> 11 <!-- <input type="button" value="toggle" @click="click"> --> 12 <input type="button" value="toggle" @click="flag=!flag"> 13 <!-- v-if 每次都是重新删除或者创建元素 ,性能切换消耗较高--> 14 <!-- v-show 不会重新进行Dom操作删除 ---只是在切换了display:none ,有初始的较高渲染消耗 --> 15 <p v-if="flag">我是一只猫</p> 16 <p v-show="flag">我是一条鱼</p> 17 18 </div> 19 <script> 20 var vm =new Vue({ 21 el:‘#app‘, 22 data:{ 23 flag:true 24 }, 25 methods:{ 26 click(){ 27 this.flag =!this.flag 28 } 29 } 30 }) 31 </script> 32 33 </body> 34 </html>
标签：创建元素 var init 性能 http html src cal inpu
原文地址：https://www.cnblogs.com/yuanxiangguang/p/10922294.html
