vue点击弹窗自动触发点击事件的解决办法(模拟场景)
更新时间：2021年05月25日 10:35:25 作者：孙叫兽
本文通过案例场景给大家介绍vue点击弹窗自动触发点击事件的解决办法，通过两种方法给大家分享vue 自动触发点击事件的处理方法，对vue自动触发点击事件相关知识感兴趣的朋友一起看看吧
业务场景：使用vue +element ui 的el-dialog，点击弹窗之后，默认加载第一个按钮的数据进行初始化。
div
指令：
// 自动触发点击事件
directives:{
trigger:{
inserted(el,binging){
// console.log("自动触发事件")
el.click()
}
}
},
PS：下面看下vue 自动触发点击事件
需要，点击左边的列表出详情，但是都需要点击事件，页面进来时，默认触发点击事件
方法一，vue自定义指令
directives:{
trigger:{
inserted(el, binging){
console.log(el.id)
el.id == 'nav0' ? el.click() : null // 只点击第一个，id是在循环中手动添加的
// $(el).trigger('click') // 所有都触发一次,然后就是最后一个
}
}
},
用法：
<span class="nav-item" :id="'nav' + index" v-trigger :class="{'active': item.stage == activeId}" @click="navClick(item)" v-for="(item, index) in nav" :key="item.stage">{{item.stage_name}}</span>
以上就是vue点击弹窗自动触发点击事件的解决办法(模拟场景)的详细内容，更多关于vue自动触发点击事件的资料请关注脚本之家其它相关文章！
相关文章
这篇文章主要介绍了Vue3 Pinia如何修改全局状态变量值问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-05-05
在网上找了好久关于左右过渡动画折叠的组件,没有合适的代码,效果类似于element UI中的Drawer抽屉组件,只不过ele中的都是悬浮的组件,工作中遇到的很多都是占用空间的展开折叠,网上很多也是上下展开收起的组件,于是就自己写了一个,分享给大家,感兴趣的朋友参考下吧2023-11-11
这篇文章主要介绍了vue.js封装switch开关组件的操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-10-10
这篇文章主要给大家介绍了关于element的表单组件的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2021-02-02
本文通过实例代码给大家介绍了vue中选项卡点击切换且能滑动切换功能，代码简单易懂，非常不错，具有一定的参考借鉴价值，需要的朋友参考下2018-11-11
在vue项目中,和后台交互获取数据这块,我们通常使用的是axios库,它是基于promise的http库,下面这篇文章主要给大家介绍了关于Vue3引入axios封装接口的两种方法,需要的朋友可以参考下2022-10-10
这篇文章主要介绍了vite+vue3全局定义less变量在单文件中使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
这篇文章主要给大家介绍了关于vue项目中向数组添加元素的3种方式,在Vue中添加元素到数组非常简单,文中通过代码介绍的非常详细,对大家学习或者使用vue具有一定的参考借鉴价值,需要的朋友可以参考下2023-10-10
ant design中upload组件上传大文件,显示进度条进度的实例
这篇文章主要介绍了ant design中upload组件上传大文件,显示进度条进度的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-10-10
这篇文章主要为大家详细介绍了vue实现顶部菜单栏，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-11-11
最新评论