如何在Vue 3 Composition API中的watch函数中使用handler.throttle函数

Question

我有一个反应数据对象filters。每当有更新时，我都需要注意变化。我在选项API中成功地做到了这一点。但是在下面的用例中，无法使其与Composition API一起工作。这是下面的代码段，请帮助我转换它，使其与setup()语法兼容。请帮我一下。

filters: {
handler: _.throttle(function() {
let query = _.pickBy(this.filters);
let route = this.route('users.index', Object.keys(query).length ? query : {
remember: 'forget'
});
this.$inertia.get(route, {}, {
only: ['usersData'],
preserveState: true,
preserveScroll: true
});
}, 300),
deep: true,
},

我可以根据Composition API所需的语法对其进行格式化，但无法_.strottle，我如何格式化以上内容，使其与Composition API以相同的方式工作？这就是我现在正在做的，记录响应。但需要将整个函数封装在_.through.中

watch(() => _.pickBy(filters), (currentValue, oldValue) => {
console.log(currentValue);
console.log(oldValue);
})

Answer 1

由于解决方案没有共享，这里有一个工作示例。

import { watch } from "vue";
import { Inertia } from "@inertiajs/inertia";
import pickBy from "lodash/pickBy";
import throttle from "lodash/throttle";

观看

watch(
() => filters,
throttle(() => {
Inertia.get(route("users.index"), pickBy(filters), {
preserveState: true,
});
}, 300),
{ deep: true }
);