帮我写一个vue2的防抖函数 并举例 首次点击会执行

好的，下面是一个基于 Vue 2.x 的防抖函数：

export default {
  methods: {
    debounce(fn, delay = 500) {
      let timer = null
      return function() {
        const context = this
        const args = arguments
        clearTimeout(timer)
        timer = setTimeout(() => {
          fn.apply(context, args)
        }, delay)
      }
    }
  }
}

使用方法：

<template>
  <div>
    <button @click="debounceClick">点击</button>
  </div>
</template>

<script>
import debounce from './debounce'

export default {
  mixins: [debounce],

  methods: {
    handleClick() {
      console.log('点击事件被触发')
    },

    debounceClick: debounce(function() {
      console.log('防抖后的点击事件被触发')
    })
  }
}
</script>

在上面的代码中，我们通过 `mixins` 将 `debounce` 混入到组件中。然后在该组件的 `methods` 中定义了 `handleClick` 和 `debounceClick` 两个方法，其中 `handleClick` 是原始的点击事件，`debounceClick` 是通过防抖函数包装后的点击事件。在模板中，我们为按钮绑定了 `debounceClick` 方法，从而实现了防抖效果。

注意：第一次点击不会被防抖，因为防抖函数的实现需要一个定时器，而第一次点击并没有定时器。如果需要第一次点击也被防抖，可以在 `debounce` 函数中加上一个 `immediate` 参数，表示是否立即执行。具体实现可以参考 Lodash 的 `debounce` 函数。