【问题标题】:Vue debounce a method?Vue去抖动的方法?
【发布时间】:2016-10-01 22:49:48
【问题描述】:

我知道 Vue.js 具有内置的功能,可以对输入字段进行去抖动。我创建了一个滑块,它触发了一个不使用输入字段的方法,我想知道我是否可以利用方法内部的去抖动功能。

除了简单地向输入添加去抖动之外,甚至可以使用此功能吗?还是我需要为此编写自己的功能?

我刚刚尝试过这样做,但它似乎不起作用:

this.$options.filters.debounce(this.search(), 2000);

【问题讨论】:

  • 在 vue.js 中似乎没有任何易于调用的去抖动功能 - 只需编写一个 - 大约 5 行代码,您应该能够在 SO 答案或快速谷歌。

标签: javascript jquery vue.js vue-component


【解决方案1】:

对于任何想知道如何做到这一点的人。我通过使用我发现的一个很棒的小 sn-p 解决了这个问题:

我的数据中的属性

timer: 0

去抖动功能

// clears the timer on a call so there is always x seconds in between calls
clearTimeout(this.timer);

// if the timer resets before it hits 150ms it will not run 
this.timer = setTimeout(function(){
    this.search()
}.bind(this), 150);

【讨论】:

  • 男人!!在处理这个 $hit 大约 2 小时后,这非常有用。爱你的男人。
  • 我不确定你是否从这里得到它,但我在这里读到了类似的 sn-p:schier.co/blog/2014/12/08/… 如果那是你的来源,作者可能值得称赞.
  • @bjmc 是从别人的 codepen 那里得到的,这不是源代码。
  • 如果您注明来源会很好。例如codepen URL
【解决方案2】:

你将 this.search() 执行结果放入 debounce,试试这个:

var bufferSearch = Vue.options.filters.debounce(this.search.bind(this), 150);
bufferSearch();

【讨论】:

    猜你喜欢
    • 2017-07-08
    • 1970-01-01
    • 2021-07-16
    • 1970-01-01
    • 2021-05-25
    • 1970-01-01
    • 2023-04-02
    • 2019-05-13
    • 2021-02-05
    相关资源
    最近更新 更多