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反彈

回答

相關問題