首页 > 代码库 > methods 方法选项

methods 方法选项

最简单的使用方法,一个数字,每点击一下按钮加1

html

<div id="app">            <span v-text="number"></span>            <button @click="add()">add</button></div>

js

  var vm = new Vue({            el:"#app",            data:{                number:1            },            methods:{                // 记得return 出来啊                add:function(){                    this.number++;                }            }        })
methods中参数的传递

html

 

<div id="app">            <span v-text="number"></span>            <button @click="add(10)">add</button></div>

 

js

var vm = new Vue({            el:"#app",            data:{                number:1            },            methods:{                // 记得return 出来啊                add:function(num){                    if(num!=""){                       this.number+=num;                    }else{                        this.number++;                    }                }            }        })
methods中的$event参数

html

<div id="app">            <span v-text="number"></span>            <button @click="add(10,$event)">add</button></div>

js

var vm = new Vue({            el:"#app",            data:{                number:1            },            methods:{                // 记得return 出来啊                add:function(num,event){                    if(num!=""){                       this.number+=num;                    }else{                        this.number++;                    }                    // 点击的很多属性都在里面                    console.log(event);                }            }        })

 

 

methods 方法选项