描述

截流装饰器

1.示例

调整窗口大小，然后请打开控制台查看打印日志

<template>
  <div>
    <el-divider>调整窗口大小，然后请打开控制台查看打印日志</el-divider>
  </div>
</template>

<script>
import { debounceDtor } from 'sf-utils2'
export default {
  mounted() {
    window.addEventListener('resize', this.onResize, false)
  },

  methods: {
    @debounceDtor(500)
    onResize() {
      console.log('监听到窗口发生变化')
    }
  },

  beforeDestroy() {
    window.removeEventListener('resize', this.onResize, false)
  }
}
</script>

显示代码 复制代码 复制代码

2.入参说明

参数	说明	类型	是否必填	默认值
wait	去抖时间	Number		300

3.源码

import debounce from '@/function/debounce'

/**
 * 函数节流装饰器
 * @param {number} wait 节流的毫秒
 * @param {Object|Boolean} options 参数{leading: 是否在之前执行, trailing: 是否在之后执行} 默认在定时器之后执行 trailing = true
 */
function debounceDtor(wait = 300, options) {
  return function (target, name, descriptor) {
    descriptor.value = debounce(descriptor.value, wait, options)
  }
}

export default debounceDtor