每周一组件之--指令-- 防抖截流指令

 

 

 

 

可以来回传递参数的指令。可以进行封装上传组件之类的

const throttleHaveParam = {

inserted: function(el, binding) {

let timeout

el.addEventListener('input', function() {

const _this = this;

const args = arguments;

if (!timeout) {

timeout = setTimeout(() => {

timeout = null;

const valueFn = binding.value.fn

const data = binding.value.data

// 注意在这里是可以传输出数据的

// 利用 promise 执行回调参数 例如页面上传返回的http 地址 也可以执行dome操作全局设置半透明蒙层

valueFn.apply(_this, [...args, data])

}, 2000)

}

})

}

}

export default throttleHaveParam

 

 

// 节流指令

const throttle = {

inserted(el, binding) {

let timeout

el.addEventListener('input', function() {

const _this = this;

const args = arguments;

if (!timeout) {

timeout = setTimeout(() => {

timeout = null;

const valueFn = binding.value

// 注意在这里是可以传输出数据的

// 利用 promise 执行回调参数 例如页面上传返回的http 地址 也可以执行dome操作全局设置半透明蒙层

// 这样就形成了一个上传的自定义指令

valueFn.apply(_this, args)

}, 2000)

}

})

}

}

export default throttle