! DOCTYPE html html head meta charset ="UTF-8" title / title / head script src ="https://cdn.bootcss.com/vue/2.6.10/vue.js" / script body div id ="app" {{tex}} hr / div v-if ="isok" 真出现 / div div v-else 假出现 / div hr / button @cl
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script> <body> <div id="app"> {{tex}} <hr /> <div v-if="isok" >真出现</div> <div v-else>假出现</div> <hr /> <button @click="add">+</button>{{count}}<button @click="jian">-</button> <hr /> <ul> <li v-for="(item,index) in arr">{{index}}-----{{item}}</li> </ul> <hr /> {{bangding}} 请输入<input type="text" v-model="bangding" /> <hr /> </div> <script type="text/javascript"> var vue=new Vue({ el:"#app", data:{ tex:"文字", isok:false, count:0, arr:["8","5","88","99"], bangding:"", }, methods:{ add:function(){ this.count++; }, jian:function(){ this.count--; } } }); </script> </body> </html>