2016-12-18 2 views
5

Я играю с React Native и lodash's debounce.React Native: Использование lodash debounce

Использование следующего кода только заставляет его работать как задержка, а не отторжение.

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

Я хочу, чтобы консоль регистрировала debounce только один раз, если я вхожу в ввод типа «foo». Сейчас он регистрирует «debounce» 3 раза.

+0

'onChangeText' вызывается каждый раз, когда вы меняете ввод, введя foo, вы можете вызвать функцию debounce 3 раза, поэтому поведение верное. – jmac

+0

@jmac Я уверен, что ошибка всегда на мне, но как это сделать, я хочу, чтобы она архивировалась, так что она срабатывает только один раз и после firering ее можно снова запустить. – Norfeldt

+2

_.debounce создает новую функцию, которая должна передаваться непосредственно как обратный вызов, но вы завернули его в дополнительную функцию и вручную создали + вызов нового экземпляра дебютной функции каждый раз, когда происходит изменение. Вы должны устранить эту дополнительную оболочку: 'onChangeText = {_. Debounce ((text) => console.log ('debouncing', text), 2000)}'. Не беспокойтесь о аргументах, они передадут их вашему обработчику. –

ответ

26

Функция дебюта должна определяться где-то вне метода визуализации, поскольку она должна ссылаться на тот же экземпляр функции каждый раз, когда вы вызываете ее как против создания нового экземпляра, как это происходит сейчас, когда вы помещаете его в обработчик onChangeText функция.

Наиболее распространенное место для определения функции дебютации находится прямо на объекте компонента. Ниже приведен пример:

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

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

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

Я уже давно пытаюсь это сделать ... Благослови ваше сердце. –

+1

@SkipSuva рада помочь! –

+0

Спасибо @GeorgeBorunov –

Смежные вопросы