Lodash's debounce and vue3

Question

I'm having an issue with debounce from lodash and vue3, could you help me find the issue in this code please?

Pinia's Store

actions: {
    fetchUsers(targetAppId?: string) {
      this.loading = true;
      AppsService.getUsers(targetAppId)
        .then(response => {
          this.users = response.data.users
          // This statement works without debounce
          debounce(() => { this.loading = false }, 1000)
        })
    },
  }

Answer 1

this will never work the way u want it to.

it's like sifriday said, debounce returns a (new) function and you would need to re-call that function for a correct working debounce. but in your store you have an anonymous function, so there's no reference to actually debounce it.

you could add a loading state & then do a debounce on a commit which toggles this state OR wrap the action itself in a debounce.