素材牛VIP会员
Vue 与 jQuery插件混用,Jquery的事件无法响应怎么解决?
 陈***半  分类:Html5  人气:1471  回帖:5  发布于6年前 收藏

我在ajax成功回到中实例化了一个vue对象,但是我后面的写的jq各种点击事件就失效了。这可如何是好?

讨论这个帖子(5)垃圾回帖将一律封号处理……

Lv1 新人
陌***人 PHP开发工程师 6年前#1

vue在数据刷新后,会刷新dom的,所以dom上绑定的jquery事件会被移除。
所以建议jquery处理的dom和vue的dom不要是同一个。

Lv1 新人
kg***25 页面重构设计 6年前#2

http://jquery.cuishifeng.cn/o... 使用jquery的on方法

Lv5 码农
bb***82 Linux系统工程师 6年前#3

实例化之后在注册事件

----补充----
使用事件代理吧

【伪码】

<div class='parent'>
    <vue-component></vue-component>
<div>
$('.parent').click(_e => {
    let _target = _e.target;
    if(_target 是你要组册的节点){
        // 执行你的回调
    }
})

当然你也可以在vue组件的生命周期的初始化事情添加事件

new Vue({
  created(){
    // do something
  }
})
Lv5 码农
面***笑 JAVA开发工程师 6年前#4

可能是你Vue绑定的el把你绑定事件的dom给覆盖了,所以所有事件都被Vue接管了,Vue绑定的el应该尽量小范围

Lv3 码奴
醋***1 技术总监 6年前#5

因为vue会重新渲染dom,加上你是异步实例vue.所以正常写程序的话jq的$()获取的元素不是vue渲染后的元素. 我们需要监听dom的变化.在vue重新渲染dom之后使用$().click.我用的是MutationObserver全局对象去监听.建议楼主可以看看.

 文明上网,理性发言!   😉 阿里云幸运券,戳我领取