对vue下点击事件传参和不传参的区别详解

来源：动视网责编：小采时间：2020-11-27 22:07:34

对vue下点击事件传参和不传参的区别详解

对vue下点击事件传参和不传参的区别详解:如下所示： <div id = 'app'> <p><button @click = 'test_click1'>{{btn_text1}}</button></p> <br> <p><button @click = 'test_click2(123)'&g

推荐度：

点击下载本文 文档为doc格式

导读对vue下点击事件传参和不传参的区别详解:如下所示： <div id = 'app'> <p><button @click = 'test_click1'>{{btn_text1}}</button></p> <br> <p><button @click = 'test_click2(123)'&g

如下所示：

<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下点击事件传参和不传参的区别详解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

对vue下点击事件传参和不传参的区别详解

对vue下点击事件传参和不传参的区别详解:如下所示： <div id = 'app'> <p><button @click = 'test_click1'>{{btn_text1}}</button></p> <br> <p><button @click = 'test_click2(123)'&g

推荐度：

点击下载本文 文档为doc格式

标签： VUE 事件参数的

热门焦点

对vue下点击事件传参和不传参的区别详解

对vue下点击事件传参和不传参的区别详解

对vue下点击事件传参和不传参的区别详解

最新推荐

猜你喜欢

热门推荐