web-dev-qa-db-fra.com

React Native: utilisation de la fonction anti-rebond lodash

Je joue avec React Native et le debash de lodash.

L'utilisation du code suivant ne fait que le faire fonctionner comme un retard et non comme un anti-rebond.

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

Je veux que la console enregistre le debounce une seule fois si j'entre une entrée comme "foo". À l'heure actuelle, il enregistre "debounce" 3 fois.

javascriptreactjsreact-nativelodash
15
Norfeldt

La fonction anti-rebond doit être définie quelque part en dehors de la méthode de rendu, car elle doit faire référence à la même instance de la fonction à chaque fois que vous l'appelez, contrairement à la création d'une nouvelle instance comme cela se produit maintenant lorsque vous la placez dans le onChangeText fonction de gestionnaire.

L'endroit le plus courant pour définir une fonction anti-rebond se trouve directement sur l'objet du composant. Voici un exemple:

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

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

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