【vue脱坑指南】 @click 参数传当前对象

最新推荐文章于 2022-12-27 18:21:53 发布
最新推荐文章于 2022-12-27 18:21:53 发布
阅读量1.3k 收藏 2
点赞数 1
文章标签： vue.js javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/harryperlau/article/details/106502298
版权

错误示例：

传 this 不能获取到当前对象。

<img :src.prop="verifycode" @click="flushVerifycode(this)"  />

 

 正确做法：

传 $event 事件。

<img :src.prop="verifycode" @click="flushVerifycode($event)" />

此时 event.currentTarget 便可以获取到当前点击事件对象。

 

harryperlau
关注
vue面向切面_Vue3 面向对象开发指南
weixin_39743064的博客
12-30 2170
本文是 Vue3 第一次实践的总结，重点在面向对象上，也会引出一些函数式使用和相关切入点的讲解复用带来的全新开发体验Vue3 更新了逻辑复用，逻辑能够很方便地进行统一提取和使用，这其实是一切编程范式的基础，意味着在 Vue3 这一平台至上，更多的编程模型可以被应用，工程化职业化更进一步，构建复杂应用的能力也更上了一级台阶Vue3 虽然是前端三大框架中最晚实现逻辑复用的框架，Angular 在15年...
vue之基础语法
weixin_59196705的博客
05-12 657
Class 与 Style 绑定 操作元素的 class 列表和内联样式是数据绑定的一个常见需求。因为它们都是 attribute，所以我们可以用 v-bind 处理它们：只需要通过表达式计算出字符串结果即可。不过，字符串拼接麻烦且易错。因此，在将 v-bind 用于 class 和 style 时，Vue.js 做了专门的增强。表达式结果的类型除了字符串之外，还可以是对象或数组。 绑定 HTML Class 语法格式: 使用方式：v-bind:class="expression" expr
关于vue的@click传递
qq_40088443的博客
03-22 3648
新手做项目碰到了需要操作点击的这个元素的问题。在Jquery里可以直接$(this)就能解决了，但是在vue里，this被赋予了特殊的含义，这样做并不可以。所以当碰上需要传递点击的这个元素时，可以用事件传递。在@click后面加上事件event。示例如下： <div @click="test($event)"> </div> 然后Vue部分： methods:{ t...
vue @click传参时this问题
weixin_43900888的博客
05-07 6096
vue中，当button的@click函数传递data中数据作为函数参数时，不可使用this.xxx，因为此时this指向button自身，而不是数据。 例如，下列为错误示范： <el-button type="primary" round @click="exchange(this.tableDatae)">兑换</el-button> export default{ data(){ return { tableData:'k' } } } 正确示范： &l
vue@click传入和使用当前对象
ss_Tina的博客
09-06 1644
vue 传入和使用当前对象
js中使用在标签中添加onclick时间传当前对象
weixin_41929877的博客
05-23 3402
html；&lt;div onclick="test(this)"&gt;测试&lt;/div&gt;js:function test(obj){       $(obj).val("123");//此处的obj就是传来的div对象。}
vue：click函数传当前数组的参数和获取当前dom
m0_37922443的博客
08-24 3460
传值：获取当前的数组的index位的数据 <tr v-for="(item,index) in message_List"> <td @click="reply(message_List[index].phone_num)">{{item.phone_num}}</td> </tr> reply: function (e) { console.log("number:" + e); }, .
Vue 面试指南附源代码
最新发布
07-12
### Vue.js面试指南知识点解析 #### 一、技术要点概览 **1. Vue.js基础** - **Vue实例**: `new Vue({})` 创建一个新的Vue实例。实例对象提供多个内部属性和方法，用来处理数据监听、编译模板、渲染DOM等。 - **...
Vue3入门指南-基础用法
m0_53266704的博客
07-02 843
Vue3入门指南-基础用法 终于 Vue3 的正式版发布了，两年多的开发，多位贡献者的努力。凝聚了这么多优秀开发者的智慧和努力，注定 Vue3 会成为下一个前端主流开发框架。本篇文章将带领大家一步步学习和了解使用vue3,当然更多的是我的学习过程。 前端就是这样，要时刻保持学习，每个月都有新技术的产生。如果每个知识都学，显然不现实，所以也要有选择性的学习。例如现在主流的三大框架，Vue/React/angular, 基于这三大框架的扩展框架我都应该有所涉及和了解。 有的小伙伴这时候会说，我们公司还没开始使
Vue快速入门指南
TinaCSDN的博客
11-20 641
0.学习目标 会创建Vue实例，知道Vue的常见属性 会使用Vue的生命周期的钩子函数 会使用vue常见指令 会使用vue计算属性和watch监控 会编写Vue组件 掌握组件间通信 了解vue-router使用 1.前言 前几天我们已经对后端的技术栈有了初步的了解、并且已经搭建了整个后端微服务的平台。接下来要做的事情就是功能开发了。但是没有前端页面，我们肯定无从下手，因此今天我们就要来了解一下前端的一些技术，完成前端页面搭建。 先聊一下前端开发模式的发展。 静态页面 最初的网页以HTML为主，是纯静
vue事件绑定(事件修饰符)、事件处理中的this
CIA的博客
10-25 936
事件绑定(修饰符) 1.事件绑定修饰符 @click.stop 停止事件冒泡 @click.self 停止向下传递 @click.prevent 阻止默认行为 @click.capture 捕获模式修饰符 @click.once 事件只绑定一次 @scroll.passive 提升滚动性能 2.按键绑定修饰符 @keydown 按键就可以触发事件 @keydown.enter 按下回车键时触发 @keydown.tab 按下tab键时触发 @keydo
[Vue]点击事件获取元素本身及事件
iChangebaobao的博客
08-08 6504
<button @click = “clickfun($event)”>点击</button> methods: { clickfun(e) { // e.target 是你当前点击的元素 // e.currentTarget 是你绑定事件的元素 } } ...
vue @click 绑定的函数，如何同时传入事件对象 e 和自定义参数
weixin_55846296的博客
12-27 3114
vue @click 绑定的函数，如何同时传入事件对象和自定义参数
Vue元素点击时获取当前对象
asing1elife's blog
09-22 2996
vue中在元素点击时获取当前对象需要手动传入当前对象 更多精彩 更多技术博客，请移步 asing1elife’s blog 在点击时传入当前对象 $event 表示当前被点击的对象 &lt;el-menu-item v-for="submenu in menu.submenus" @click="clickSubmenu(submenu.operations, $event)"&gt;...
vue3的自定义事件传参
mfxcyh的博客
06-12 5621
在vue3中使用自定义事件传输数据
vue中传值的方法
czw2ly的博客
12-05 3354
主要是谈谈vue中组件传值的方法，供大家参考
html里onclick方法传对象的方法
qq_41807404的博客
10-25 2362
            var objJson = JSON.stringify(json_xx[i]);//对象转json字符串             objJson = objJson.replace(/\"/g, "'");//将转成的字符串里的双引号转成单引号，使html得以识别             html_zdry += '&lt;div&gt; '  + '" onclick=...
vue事件中点击对象（this）
yiyueqinghui的博客
11-21 1万+
vue事件中点击对象（this）,currentTarget 和 target的区别 区别如下 target指向,事件最终所作用于的对象 currentTarget指向，事件定义时所在的对象 例子如下 &lt;template&gt; &lt;div id="this_api"&gt; &lt;p class="welcome" @click="tap"&g..
vue click同时传入事件对象和自定义参数
热门推荐
马优晨
06-25 8万+
仅仅传入自定义参数 HTML <div id="app"> <button @click="tm(123)">ddddd</button> </div> JS代码 new Vue({ el:'#app', methods:{ tm:function(e){ console.log(e); } ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值