i-view(view UI)中submenu无法增加点击事件的处理办法
iview中的menu很好用,但是有很多需求是,不光点击子菜单需要触发,有时候点击父菜单也是需要触发少量事件的。但是偏偏subMenu增加不了点击事件。
根据官方api
menu整体的触发事件
submenu的api
我们不难发现,submenu的确是没有触发函数的,只有menuitem有。
我在网上找到少量处理办法,感觉不是很贴合我的需求。大体就是F12找到submenu对应的class,而后用类选择器,对所有这种类的element增加click。但是有局限性,如果我是在v-for里面呢?或者者需要传v-model里的值呢?
先说menuitem的处理:
<Menu-Item v-if="!item5.fileMenu" :name='index.toString() + "-"' @click.native="leftMenuOnclick(item5.id,false)">
直接onclick,或者者@click触发不了,需要在后面加个.native。其实就是对于menuitem,就2种状态,一种是选中,一种是没选中,当我们点击的时候,不就相当于是选中吗,所以加个.native即可以触发了。
submenu的话,也简单
首先看官方的demo是怎么使用submenu的,
官方demo
先看我一开始的尝试
直接放在submenu上,没用
发现并无法触发,而后我F12发现,menu标签会转化成一个ul,而submenu,会转化为一个div
submenu浏览器渲染之后
所以我最后的处理方法是干脆自己包一个div,而后给div加click事件,是不是超级简单,而且在渲染之后,也没有任何区别
<i-menu width="auto" :theme="leftMenuTheme"> <!-- first time --> <template v-for="(item,index) of leftMenuList"> <Submenu :name="index"> <template slot="title" > <div @click="leftMenuOnclick(item.id,true)"> <i class="ivu-icon ivu-icon-ios-people" style="font-size: 16px;"></i>{{item.name}} </div> </template>说明
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » i-view(view UI)中submenu无法增加点击事件的处理办法
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » i-view(view UI)中submenu无法增加点击事件的处理办法