React Native：使用lodash反弹

我在玩React Native和lodash的debounce。React Native：使用lodash反弹

使用下面的代码只能使其工作像延迟而不是去抖动。

<Input 
onChangeText={(text) => { 
    _.debounce(()=> console.log("debouncing"), 2000)() 
} 
/>

我想要控制台只记录一次debounce，如果我输入像“foo”这样的输入。现在它记录了“反弹”3次。

来源

2016-12-18 Norfeldt

'onChangeText'被调用每次更换输入时间，输入foo将让防抖动功能调用3倍，这样的行为是正确的。 – jmac

@jmac我很确定这个错误总是在我身上，但它是如何存档的我想要所以它只会触发一次，并且在触发它之后可以再次触发 – Norfeldt

_.debounce创建一个新函数，应该直接传递一个回调函数，但是你已经将它包装在额外的函数中，并且每次发生变化时手动创建+调用一个新的去抖函数实例。你应该消除这个额外的包装：'onChangeText = {_。debounce（（text）=> console.log（'debouncing'，text），2000）}'。不要担心这些争论，它会将它们传递给你的处理程序。 –

Debounce函数应该定义在render方法之外的某个地方，因为每次调用它时都必须引用该函数的同一个实例，因为反对创建一个新实例，就像现在发生在您将其放入onChangeText处理函数中一样功能。

最常见的定义去抖功能的地方就在组件的对象上。这里有一个例子：

class MyComponent extends React.Component { 
    constructor() { 
    this.onChangeTextDelayed = _.debounce(this.onChangeText, 2000); 
    } 

    onChangeText(text) { 
    console.log("debouncing"); 
    } 

    render() { 
    return <Input onChangeText={this.onChangeTextDelayed} /> 
    } 
}

来源

2016-12-19 04:53:57

我一直在努力尝试做这么久......祝福你的心。 –

@SkipSuva乐于帮忙！ –

谢谢@GeorgeBorunov –

React Native：使用lodash反弹

回答

相关问题