對vue下點擊事件傳參和不傳參的區(qū)別詳解
更新時間：2018年09月15日 10:23:51 作者：宇智波幽助
今天小編就為大家分享一篇對vue下點擊事件傳參和不傳參的區(qū)別詳解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
如下所示：
<div id = 'app'>
<p><button @click = 'test_click1'>{{btn_text1}}</button></p>
<br>
<p><button @click = 'test_click2("123")'>{{btn_text2}}</button></p>
</div>
<script src="https://cdn.bootcss.com/vue/2.5.8/vue.min.js"></script>
<script type="text/javascript">
var _vm = new Vue({
data : {
btn_text1 : '點擊1' ,
btn_text2 : '點擊2'
},
methods : {
test_click1 : function (e) {
console.log('test_click1--------------------------') ;
console.log(e) ;
// 輸出結果：MouseEvent {isTrusted: true, screenX: 40, screenY: 121, clientX: 40, clientY: 30, …}
console.log(e.target) ; // 輸出結果：<button>點擊1</button>
console.log('test_click1--------------------------') ;
},
test_click2 : function (e) {
console.log('test_click2--------------------------') ;
console.log(e) ; // 輸出結果：123
console.log(e.target) ; // 輸出結果：undefined
console.log('test_click2--------------------------') ;
}
}
}).$mount('#app');
</script>
以上這篇對vue下點擊事件傳參和不傳參的區(qū)別詳解就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
element-ui之關于組件BackToTop回到頂部的使用
這篇文章主要介紹了element-ui之關于組件BackToTop回到頂部的使用,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
element-ui修改el-form-item樣式的詳細示例
在使用element-ui組件庫的時候經(jīng)常需要修改原有樣式,下面這篇文章主要給大家介紹了關于element-ui修改el-form-item樣式的詳細示例,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-11-11
vue發(fā)送websocket請求和http post請求的實例代碼
這篇文章主要介紹了vue發(fā)送websocket請求和http post請求的方法，本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值 ,需要的朋友可以參考下2019-07-07
這篇文章主要介紹了vant-ui組件庫中如何修改NavBar導航欄的樣式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-08-08
Vue實現(xiàn)雙向綁定的原理以及響應式數(shù)據(jù)的方法
這篇文章主要介紹了Vue實現(xiàn)雙向綁定的原理以及響應式數(shù)據(jù)的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-07-07
這篇文章主要介紹了vue2.0 如何在hash模式下實現(xiàn)微信分享,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-01-01
這篇文章主要為大家介紹了Pinia 的 Setup Stores 語法使用實例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-09-09
這篇文章主要給大家介紹了關于Vue-CLI多頁分目錄打包的相關資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2021-04-04
最近在學習vue,感覺路由守衛(wèi)這個地方知識點挺多的,而且很重要,下面這篇文章主要給大家介紹了關于vue3中7種路由守衛(wèi)的使用大全,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2023-03-03
vue項目中請求數(shù)據(jù)特別多導致頁面卡死的解決
這篇文章主要介紹了vue項目中請求數(shù)據(jù)特別多導致頁面卡死的解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09