12.2 VUE學習之-if判斷,實踐加減input裡的值
阿新 • • 發佈：2019-01-06
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>vue</title> <link rel="stylesheet" href=""> <!--<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>--> <!--<script type="text/javascript" src="../js/jquery-2.1.4.min.js"></script>--> <script type="text/javascript" src="../js/vue.js"></script> </head> <body> <div id="vue"> <div> <span v-if="num > 0" v-on:click="dec(num)">-</span> <input v-model="num" type="text"> <span v-on:click="inc(num)">+</span> </div> </div> </body> <script type="text/javascript"> var app = new Vue({ el: "#vue", methods:{ dec:function(num){ if(app.num>0){ app.num=num-1; console.log(app.num); } }, inc:function(num){ app.num=num+1; console.log(app.num); } }, data:{ num:0, } }); </script> </html>
效果:
