vue3节流防抖实现

以下是两种Vue3实现节流和防抖的方法：

1. 在`setup`函数中使用`lodash`库实现节流和防抖：

import _ from "lodash";

export default {
  name: "",
  setup() {
    // 节流
    const btnClick = _.debounce(function() {
      // ....
      console.log('节流');
    }, 2000);

    // 防抖
    const btnClick2 = _.throttle(function() {
      // ....
      console.log('防抖');
    }, 2000);

    return {
      btnClick,
      btnClick2,
    };
  },
};

2. 在Vue3组件的`created`生命周期钩子中使用`lodash`库实现节流和防抖：

import _ from "lodash";

app.component('save-button', {
  created() {
    // 用 Lodash 的防抖函数
    this.debouncedClick = _.debounce(this.click, 500)
  },
  unmounted() {
    // 移除组件时，取消定时器
    this.debouncedClick.cancel()
  },
  methods: {
    click() {
      // ... 响应点击 ...
    }
  },
  template: `
    <button @click="debouncedClick"> Save </button>
  `
});