基本上，我需要在文本更改時點擊搜索 API，但在 TextInput 中的每次更改時呼叫 API 并不是一件好事。那么，當用戶完成編輯（停止輸入）時，該組件中是否存在任何回呼函式？如果我們在用戶停止輸入時觸發 API，那將是最好的。
我已經嘗試過onEndEditing但在我停止寫作后它沒有被觸發。
uj5u.com熱心網友回復：
如果您想自動檢測用戶何時完成編輯，您可以執行以下操作
const [value, setValue] = React.useState('');
const timeout = React.useRef(null);
const onChangeHandler = (value) => {
clearTimeout(timeout.current);
setValue(value);
timeout.current = setTimeout(()=>{
searchFunction(value)
}, 2000);
}
return (
<View>
<TextInput
value={value}
onChangeText={ (value) => {onChangeHandler(value)} }
/>
</View>
這將在用戶完成輸入 2 秒后呼叫搜索功能，并且每當他們輸入內容時都會重繪 持續時間
或者您可以嘗試 onBlur ，一旦輸入不再聚焦，它們就會觸發，并且不會僅僅因為您完成輸入而觸發
uj5u.com熱心網友回復：
請參考：https ://stackoverflow.com/a/41215941/9315094
另外：https ://stackoverflow.com/a/58594890/9315094
Debounce 函式應該定義在 render 方法之外的某個地方，因為每次呼叫它時它都必須參考該函式的同一個實體，而不是像現在將它放在 onChangeText 處理函式中那樣創建一個新實體。
定義 debounce 函式的最常見位置是在組件的物件上。這是一個例子：
class MyComponent extends React.Component {
constructor() {
this.onChangeTextDelayed = _.debounce(this.onChangeText, 2000);
}
onChangeText(text) {
console.log("debouncing");
}
render() {
return <Input onChangeText={this.onChangeTextDelayed} />
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/445042.html
下一篇：計算反應原生的休息日