vue-seamless-scroll 点击事件不生效

问题:在使用此插件时发现,列表内容前几行还是能正常点击的,但是从第二次出现的列表开始就没有点击事件了
原因:因为html元素是复制出来的(滚动组件是将后面的复制出来一份,进行填铺页面,方便滚动)
解决:往滚动组件的父节点上添加绑定事件(js冒泡机制),通过e.target定位到具体点击位置,然后判断点击位置是否是你滚动组件的一列/行

具体实现

 
{{ item.name }} ({{ item.address }})
暂无公司数据...
chooseCompany(e: any) { const child: any = e.target.closest(".warp-item-li"); // 获取点击的那一项 let index: any = child.getAttribute("chooseIndex"); // 获取那一项自定义的 chooseIndex参数 if (index) { // 逻辑代码... (this.$parent as any).showCompanyDialog(this.companyList[index]); } }

你可能感兴趣的:(后台管理系统,vue项目中常用操作,大屏,vue.js,前端,javascript)