防抖与节流及lodash的防抖节流的使用

防抖

多次触发，重新计时，只执行最后一次。

应用场景：输入框、搜索框用户在不断输入时、窗口大小改变，等窗口调整完成后，计算窗口大小。防止重复渲染。

节流

规定时间内 只触发一次。

应用场景：监听滚动事件，比如是否滑到底部自动加载更多、在加入购物车增加商品数量，防止用户操作频繁。

lodash的防抖与节流函数

我在vue项目中用到了lodash里的防抖和节流，更好用一些，需要安装插件。

npm i lodash

方式一：全部引入——以防抖为例

import _ from "/lodash"

_.debounce(function(){

//异步任务

},1000)

方式二：按需引入——以节流为例

import throttle from "lodash/throttle"

handle:throttle(function(){},1000)