标签: debouncing

我一直在使用jQuery/AngularJS指令在Firebase支持的应用程序中对输入进行去抖动.它来自Lars Gersmann的帖子,并且工作得很好:

http://orangevolt.blogspot.com.au/2013/08/debounced-throttled-model-updates-for.html

从Angular 1.0.8更新到1.2似乎打破了局面.每次指令触发时,$ ._ data函数都会返回一个未定义的错误,而不是从元素中提取事件,从而导致出现此错误:

TypeError:Object.keys在Function.keys(native)上的非对象上调用

它在这里定义:

 var map = $._data( element[0], 'events'),
 events = $.each( Object.keys( map), function( index, eventName) {
    // map is undefined :(
    ...
 }

AngularJS甚至是jQuery中的某些东西是否会像过去那样拉动这个元素的事件？

(旁注,我使用的是jQuery版本1.8.3,在Angular升级中没有改变).

感谢任何能够对此有所了解的人!

有谁知道如何在此方法中的反跳之前执行 this.isLoading = true ？

它应该是一个加载旋转器，当通过 axios 进行异步调用时，它将被动画化。

    methods: {
        searchAdminUsers: _.debounce(function(query) {
            this.isLoading = true       
            axios.get('api/searchEmployees?format=json', { params: { q:query } })
            .then(response => {
                let data = response.data.map(item => (
                    { text: `${item.FIRSTNAME} ${item.LASTNAME} - ${item.POSITION}`, id: item.ID }
                ))
                this.options = data
                this.isLoading = false
          })
          .catch(error => {
            console.log(error)
          })
        }, 250)
    }

我的意思是我想为方法调用做一个简单的调整。我有这种方法：

public void called(int number){
   doSomething(number);
}

经常调用此方法，我想根据接收到debounce的数字和对的调用创建一个可观察的对象doSomething(number)。

这可能吗？

我遇到了 Ganssle关于开关去抖动的这段代码。代码似乎非常有效，我的几个问题可能非常明显，但我希望得到澄清。

• 为什么他检查 10 毫秒的按钮按下时间和 100 毫秒的按钮释放时间。他不能只检查 10 毫秒的按下和释放吗？
• 是从 main 每 5 毫秒轮询一次这个函数是执行它的最有效方法，还是我应该检查引脚中的中断，当有中断时，将引脚更改为 GPI 并进入轮询例程，在我们推断出值切换之后引脚回到中断模式？

#define CHECK_MSEC  5   // Read hardware every 5 msec
#define PRESS_MSEC  10  // Stable time before registering pressed
#define RELEASE_MSEC    100 // Stable time before registering released
// This function reads the key state from the hardware.
extern bool_t RawKeyPressed();

// This holds the debounced state of the key.
bool_t DebouncedKeyPress = false;

// Service routine called every CHECK_MSEC to …

我正在尝试使用 Lodash 的debounce功能来消除文本输入字段更改的抖动。

import React from "react";
import debounce from 'lodash.debounce';

const Input = () => {

  const onChange = debounce((e) => {
    const { value } = e.target;
    console.log('debounced value', value)
  }, 1000)

  return (

    <input type="text" onChange={ onChange } />

  )
};

上面的代码抛出以下错误：

警告：出于性能原因重用此合成事件。如果您看到此内容，则说明您正在访问已发布/无效的合成事件的属性目标。这被设置为空。如果必须保留原始合成事件，请使用 event.persist()。

未捕获的类型错误：无法读取 null 的属性“值”

什么是正确的实施？

我有一个这样定义的方法

updateHook(obj) {
  // update the item
}
// https://www.npmjs.com/package/throttle-debounce
const update = debounce(updateHook, 2000);

我想合并所有参数并在 2 秒内多次调用该方法时调用它一次，例如

update({ name: 'abc' }); // first call
update({ city: 'def' }); // second call
update({ cell: 123 }); // third call
.... ~2 seconds
// should send one call to update with all the params merged like
update({ name: 'abc', city: 'def', cell: 123 });

注意：不需要使用 debounce，要求是我只想调用具有合并参数的方法（如果该方法在 2 秒的时间段内被多次调用）。

所有模拟尝试都会产生错误：

import useDebounce from 'use-debounce'
jest.mock('use-debounce')

TypeError: (0 , _useDebounce.useDebounce) is not a function or its return value is not iterable

尝试仅针对该模拟也失败：

jest.mock('use-debounce',() => {
  return {
    useDebounce: jest.fn(value => [value])
  }
})

也给出了同样的错误。使用模拟计时器也不起作用。

我试图使用lodash,debounce来反复搜索.

但是当它运行时我收到了类型错误

TypeError: Cannot read property 'debounce' of undefined

我试过在代码中移动它但无法理解为什么它不起作用

我开始导入它

import { _, debounce } from 'lodash'

我有一个输入如下

<input
    type="text"
    value={this.state.query}
    onChange={(e) => {this.updateQuery(e.target.value)}}
    placeholder="Search by title or author"
/>

连接到此功能

updateQuery = (query) => {
    _.debounce(() => query(this.setState({ query }), 500))
    this.onBookSearch(query)
}

有谁知道这是为什么？

如何debounce在async功能上使用？我的vue-app中有一个方法，该方法可从API检索数据，该方法连续调用该API，而我想避免这种情况。

这是我的方法：

methods: {
    async getAlbums () {
     const response = await AlbumService.fetchAlbums()
     this.albums = response.data.albums
    } 
}

我以前已经安装了，lodash那么如何实现呢？

在我的 Android Kotlin 项目中，我在协程中调用了一个 webservice（myWebservice只是一个管理 webservice 调用的自定义类）：

fun searchForItems(userInput: String)
{
    CoroutineScope(Dispatchers.IO + Job()).launch {
        val listOfItems = myWebService.call(userInput)
    }
}

每次用户在一个字符中键入一个字符时都会调用该方法 EditText，因此该应用程序会调用 Web 服务，该服务会返回与其请求匹配的项目列表。但我想优化它。

假设用户键入单词：“apple”。为了尽量减少 webservice 调用的次数，这是我想要实现的：

• 当用户输入第一个字母 (a) 时，webservice 被调用
• 当用户键入下一个字母时，只要第一个调用没有返回，就没有新的 webservice 调用（假设他有足够的时间键入下一个字母 (pple)）
• 当第一个 webservice 调用完成时，新的调用会自动完成，新的用户输入（苹果）

实现这一目标的最佳实践是什么？或者有没有更好的方法来减少网络服务调用的次数？

谢谢。