v-on的参数问题
1.事件調用的方法沒有參數
?
2.在事件定義時,?寫方法時省略了小括號,?但是方法本身是需要一個參數的,?
????這個時候,?Vue會默認將瀏覽器生產的event事件對象作為參數傳入到方法
?
3.方法定義時,?我們需要event對象,?同時又需要其他參數
??在調用方式,?如何手動的獲取到瀏覽器參數的event對象:?$event
注：如果函數需要參數,但是沒有傳入,?那么函數的形參為undefined
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title> </head> <body><div id="app"><!--1.事件調用的方法沒有參數--><button @click="btn1Click()">按鈕1</button><button @click="btn1Click">按鈕1</button><!--2.在事件定義時, 寫方法時省略了小括號, 但是方法本身是需要一個參數的, 這個時候, Vue會默認將瀏覽器生產的event事件對象作為參數傳入到方法--><!--<button @click="btn2Click(123)">按鈕2</button>--><!--<button @click="btn2Click()">按鈕2</button>--><button @click="btn2Click">按鈕2</button><!--3.方法定義時, 我們需要event對象, 同時又需要其他參數--><!-- 在調用方式, 如何手動的獲取到瀏覽器參數的event對象: $event--><button @click="btn3Click(abc, $event)">按鈕3</button> </div><script src="../js/vue.js"></script> <script>const app = new Vue({el: '#app',data: {message: '你好啊',abc: 123},methods: {btn1Click() {console.log("btn1Click");},btn2Click(event) {console.log('--------', event);},btn3Click(abc, event) {console.log('++++++++', abc, event);}}})// 如果函數需要參數,但是沒有傳入, 那么函數的形參為undefined// function abc(name) {// console.log(name);// }//// abc() </script></body> </html>?
總結
- 上一篇： let/var——事实上var的设计可以
- 下一篇： v-on的修饰符