javascript - 如何在 Vue 中的方法函数之前设置变量(去抖)？

Question

如何在调用函数之前设置isLoading = true？现在，isLoading 为 false，直到调用去抖动函数为止。

<script>
import _ from 'lodash'
export default {
  data: {
     isLoading: false;
  }
  methods: {
    fetch: _.debounce(function() {
      this.isLoading = true;
      // fetch my data
      this.isLoading = false;
    }, 200)
  }
}
</script>

Answer 1

我认为这应该可以解决问题:

methods: {
  fetch: _.debounce(function() {
    // fetch my data
    this.isLoading = false;
  }, 200),
  askForData: function() {
    this.isLoading = true;
    this.fetch();
  }
}

现在，只要需要新数据(我猜是用户操作)，您就可以调用 askForData。这会将加载设置为 true 并调用 fetch。由于 fetch 已被反跳，任何其他对 fetch 的立即调用都不会触发另一个 http 请求，但现在 loading 状态已得到正确处理。