vue中解决滑动组件亲测好用的防抖插件-Lodash（点击一次元素，元素触发多次事件问题,带参数）

公司有个vue项目其中的滑动组件是cube-ui，这个组件已经没有人维护了。现在线上的app出现了点击一次触发n次的bug。使用过@click.once但是这个只会执行一次，返回到我的页面的时候再次点击就失效了不符合需求。@click.stop，@click.prevent解决冒泡，默认事件也不符合。查看过了绑定元素频繁切换tab的时候是创建了多个一样的元素，所以点击一次的时候是同时触发了多个一样的元素。

最后用了一个防抖函数封装的插件。官方文档地址：https://www.lodashjs.com/docs/lodash.debounce

1.vue中安装
$ npm i -g npm
$ npm i --save lodash
2.在页面中引入

// 上关键位置代码
<template>
	<div ref="scrolls" class="card-items" :style="scrollContentStyle">
            <div class="card-item"
              v-for="(data, index) in list"
              :key="index">
                   <div class="top" @click="handleCard(data, index)"></div>
             </div>
     </div>

<script>
const _ = require('lodash')
methods: {
	handleCard: _.debounce(function(cardItem, index) {
		//逻辑代码
	}, 200),
}
</script>