vue组件的hover事件模拟、给第三方组件绑定事件不生效问题


1、vue里面实现hover效果基本需要用事件模拟

<div @mouseover="overShow" @mouseout="outHide"> 

  或者是:mouseenter、mouseleave

2、比如给第三方组件ElementUI的button,在绑定mouseover和mouseout事件时,发现绑在按钮上时无效的。

解决方案:如果这个组件没处理这两个事件的话是绑不了的。可以添加.native修饰符,就可以把事件绑到组件的根元素上

<el-button type="primary" icon="el-icon-search" plain round 
@mouseenter.native="knowledge = '即将推出,敬请期待'"
@mouseleave.native="knowledge = '知识库搜索答案'">{{knowledge}}</el-button>

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM