i-view(view UI)中submenu无法添加点击事件的解决办法
iview中的menu很好用,但是有很多需求是,不光点击子菜单需要触发,有时候点击父菜单也是需要触发一些事件的。但是偏偏subMenu添加不了点击事件。
根据官方api
menu整体的触发事件
submenu的api
我们不难发现,submenu确实是没有触发函数的,只有menuitem有。
我在网上找到一些解决办法,感觉不是很贴合我的需求。大体就是F12找到submenu对应的class,然后用类选择器,对所有这种类的element添加click。但是有局限性,假如我是在v-for里面呢?或者需要传v-model里的值呢?
先说menuitem的解决:
直接onclick,或者@click触发不了,需要在后面加个.native。其实就是对于menuitem,就2种状态,一种是选中,一种是没选中,当我们点击的时候,不就相当于是选中吗,所以加个.native就可以触发了。
submenu的话,也简单
首先看官方的demo是怎样使用submenu的,
官方demo
先看我一开始的尝试
直接放在submenu上,没用
发现并无法触发,然后我F12发现,menu标签会转化成一个ul,而submenu,会转化为一个div
submenu浏览器渲染之后
所以我最后的解决方法是干脆自己包一个div,然后给div加click事件,是不是超级简单,而且在渲染之后,也没有任何区别
{{item.name}}
发表评论 (审核通过后显示评论):