二十二、Methods Option 方法選項
阿新 • • 發佈：2018-12-18
Methods Option 方法選項
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script type="text/javascript" src="../assets/js/vue.js"></script> <title>methods Option</title> </head> <body> <h1>methods Option</h1> <hr> <div id="app"> {{a}} <p><button @click="add(2,$event)">add</button></p> <!--.native修飾器來呼叫構造器裡的add方法--> <p><btn @click.native="add(3)"></btn></p> <p><button onclick="app.add(4)" >外部呼叫構造器裡的方法</button></p> </div> <script type="text/javascript"> //add按鈕封裝成元件 var btn={ template:`<button>元件Add</button>` } var app=new Vue({ el:'#app', data:{ a:1 }, methods:{ //傳遞的$event引數都是關於你點選滑鼠的一些事件和屬性。 add:function(num,evnet){ if(num !=''){ this.a=this.a+num; }else { this.a++; } console.log("evnet:"+evnet); } }, components:{ "btn":btn } }) </script> </body> </html>