How to use p-debounce - 7 common examples

this.requestConfig[this.requestConfig.method === 'get' ? 'params' : 'data'] = options.params;
    this._loading = false;
    this._status = null;
    this._data = null;
    this._headers = null;
    this._error = null;
    this._lastLoaded = null;
    this._eventListeners = {};
    this.keepData = !!options.keepData;
    this.cache = options.cache;
    this.id = id;
    this.ssrPrefetched = false;
    this.cacheHit = false;
    this.prefetch = typeof options.prefetch === 'string' ? options.prefetch.toLowerCase() === method : Boolean(options.prefetch);
    this.ssrPrefetch = options.ssrPrefetch;
    this.fetchDebounced = pDebounce(this.fetch.bind(this), options.debounce || 80, {
      leading: true
    }); // Set Transformers

    if (options.transformer) {
      if (typeof options.transformer === 'function') {
        this.setTransformer(options.transformer);
      } else if (typeof options.transformer === 'object') {
        this.setResponseTransformer(options.transformer.response);
        this.setErrorTransformer(options.transformer.error);
      }
    }

    this.responseTransformer = this.responseTransformer || (r => r);

    this.errorTransformer = this.errorTransformer || (r => r); // Set interval.

this._loading = false
    this._status = null
    this._data = null
    this._headers = null
    this._error = null
    this._lastLoaded = null
    this._eventListeners = {}
    this.keepData = !!options.keepData
    this.cache = options.cache
    this.id = id
    this.ssrPrefetched = false
    this.cacheHit = false

    this.prefetch = typeof options.prefetch === 'string' ? options.prefetch.toLowerCase() === method : Boolean(options.prefetch)
    this.ssrPrefetch = options.ssrPrefetch
    this.fetchDebounced = pDebounce(this.fetch.bind(this), options.debounce || 80, { leading: true })

    // Set Transformers
    if (options.transformer) {
      if (typeof options.transformer === 'function') {
        this.setTransformer(options.transformer)
      } else if (typeof options.transformer === 'object') {
        this.setResponseTransformer(options.transformer.response)
        this.setErrorTransformer(options.transformer.error)
      }
    }
    this.responseTransformer = this.responseTransformer || (r => r)
    this.errorTransformer = this.errorTransformer || (r => r)

    // Set interval.
    if (options.interval) {
      this.startInterval(options.interval)

const payload = this.preparePayload(this.model)
      return this.onSubmit(payload)
    },

    preparePayload(value) {
      const course = this.courseTag
      const students =
        value.students && value.students.map(x => x.name).join(', ')
      const registrationNumbers =
        value.students &&
        value.students.map(x => x.registrationNumber).join(', ')

      return { ...value, course, students, registrationNumbers }
    },

    getStudentCompletions: pDebounce(function getStudentCompletions(i, name) {
      this.model.students[i].registrationNumber = ''
      return this.$services.students
        .fetchPage({
          name: `%${name}%`,
          course: this.courseTag,
          noDefense: true
        })
        .then(res => {
          this.possibleCompletionStudents.students = res.data.filter(
            student =>
              !this.model.students.find(
                other => other.registrationNumber === student.registrationNumber
              )
          )
        })
    }, 500),

handler(value) {
        pDebounce(() => {
          this.$emit('input', this.preparePayload(value))
        }, 500)
      }
    }

}
            ]
          : []),
        {
          field: 'status',
          label: 'Status'
        },
        ...(this.showConcludingCertificate
          ? [{ field: 'concludingCertificate', label: 'Certificado' }]
          : [])
      ]
    },
    emptySelected() {
      this.selectedStudent = null
    },
    getStudentsFilters: pDebounce(function getStudentsFilters() {
      this.getStudents()
      this.$emit('move')
    }, 500),
    getStudents() {
      this.loading = true
      this.$services.students
        .fetchPage(this.getParams)
        .then(res => {
          this.studentsData = res.data
          this.previousTotal = this.total
          this.total = res.headers['pagination-row-count']
          this.perPage = res.headers['pagination-page-size']
        })
        .catch(() => {
          this.$toast.open({
            message: `${this.title}: Falha ao carregar a lista de alunos.`,

prefix: 'Credenciamento de Membro Externo',
          key: 'credenciamento5',
          name: this.preEditDefense.evaluator3Name,
          type: this.preEditDefense.evaluator3Type
        }
      ].filter(validExternalEvaluator)

      return requiredDocuments.concat(certificates).concat(credentials)
    },
    isAdmin() {
      return this.currentUser.role === 'admin'
    }
  },

  watch: {
    searchStudentName: pDebounce(function triggerSearch() {
      this.loadDefenses()
    }, 500),
    courseTag() {
      this.loadDefenses()
    }
  },

  created() {
    this.loadDefenses()
  },

  methods: {
    toggleEditDefense() {
      this.editDefense = !this.editDefense
      if (this.editDefense === false) {
        this.selectedDefense = Object.assign({}, this.preEditDefense)

data() {
    return {
      updateMyUser: false,
      showSelectBox: true,
      updateOtherUser: false,
      otherUser: false,
      username: '',
      selectedUser: '',
      possibleCompletionUsers: {
        users: [],
        index: undefined
      }
    }
  },
  methods: {
    getUserCompletions: pDebounce(function getUserCompletions(name) {
      return this.$services.users
        .fetchPage({ username: `%${name}%`, page: false })
        .then(res => {
          this.possibleCompletionUsers.users = res.data
        })
    }, 500),
    onSelectedUser(user) {
      this.selectedUser = user
    },
    toggleUpdate(type) {
      if (type === 'updateMyUser') {
        this.updateMyUser = true
        this.showSelectBox = false
      }
      if (type === 'updateOtherUser') {
        this.updateOtherUser = true