vue自定义指令directives同时传递多个参数

// 自定义指令v-hClick绑定for循环第二个参数,这里的inx还可以是其他标的，指令中可通过其做出判断

在dom，将多个参数通过数组的格式进行存放就可以了,在如下代码binding中和index中均可以拿到数据。

<div
v-for="(item, inx) in titleList"
:class="tit == item.title ? 'listDom activeColor' : 'listDom'"
:key="inx"
v-hClick="([inx, $route])"
@click="hClickList(item)"
></div>directives: {hClick: {inserted(el,binding,index) {console.log(el);console.log(binding);console.log(index);if (!index.data.directives[0].value[1].params.title) {console.log(binding);if(binding.value[0]===0){     // 给for循环第一个元素执行点击事件console.log(999);el.click()}}}}
},

效果

vue自定义指令directives同时传递多个参数相关推荐

vue 自定义指令 directives
原文链接: vue 自定义指令 directives 上一篇: vue 事件修饰符 stop,capture,prevent 下一篇: js 坑... vue 可以自己扩充指令增加一个v-color ...
vue自定义指令directives实现自动点击事件及自动点击第一个按钮
业务场景:点击弹窗默认加载第一个按钮的数据.vue自定义指令directives实现这个需求目录自动点击所有的按钮. 自动点击第一个按钮, 自动点击所有的按钮. <ul class=&quo ...
Vue 自定义指令的注册方式和选项参数
目录 1. 注册方法 1.1 全局注册的写法 1.2 局部注册的写法 2. 自定义指令的选项 2.1 选项 2.2 钩子函数的参数 1. 注册方法自定义指令的注册方法,分为全局注册和局部 ...
Vue2自定义指令directives简介
我们在学习vue的时候会学习多个指令,如v-show,v-text,v-pre等等.但如果我们想要完成一些现有指令无法完成的操作的时候,就应该使用自定义指令来实现我们想要的操作.所以现在我们就来简单讲 ...
vue 自定义指令 directive 全局 directives 局部 inserted update
vue 自定义指令需求效果全局 - 自定义指令代码局部 - 自定义指令代码自定义命令传值效果代码问点需求获取标签,扩展额外的功能效果全局 - 自定义指令代码 // mai ...
vue自定义指令封装节流_Vue自定义指令封装节流函数的方法示例
节流函数是web前端开发中经常用到的一个开发技巧,在input实时搜索,滚动事件等,为了避免过多消耗性能,我们都会使用节流函数.在<JavaScript高级程序设计>一书中有这样的一个例子 ...
vue自定义指令---处理加载图片失败时出现的碎图,onerror事件
目录一.自定义指令 1.局部注册和使用 2.全局注册和使用二.自定义指令处理图片加载失败(碎图) 一.自定义指令 vue中除v-model.v-show等内置指令之外,还允许注册自定义指令,获取D ...
clientsideevents能定义几个click事件_分享8个非常实用的Vue自定义指令
作者:lzg9527 https://juejin.cn/post/6906028995133833230 在 Vue,除了核心功能默认内置的指令 ( v-model 和 v-show ),Vue 也 ...
html标签outclick,vue自定义指令(Directive中的clickoutside.js)的理解
阅读目录 vue自定义指令clickoutside.js的理解 vue自定义指令请看如下博客: 一般在需要 DOM 操作时我们都需要使用自定义指令的方式去实现,当然一些特殊的事件监听也可以使用指令,例 ...

vue自定义指令directives同时传递多个参数

vue自定义指令directives同时传递多个参数

vue自定义指令directives同时传递多个参数相关推荐

最新文章

热门文章