我正在做簡單的 Android 應用程式,必須在螢屏上顯示變數的內容,并且我有將字串附加到現有變數的組件。在功能應用程式中,我有:
export default function App() {
const [getNumber, setNumber] = useState('');
return (
<>
<View style={styles.numbers}>
<Text>
{getNumber}
</Text>
</View>
<Pressable style={styles.key} onPress={function(){
setNumber(getNumber => getNumber 'addition');
}}>
<Text>Add</Text>
</Pressable>
...
</>
);
}
此實作有效,但是當我嘗試從中提取和概括功能時 Pressable
export default function App() {
const [getNumber, setNumber] = useState('');
funtion addString(stringToAdd){
setNumber(getNumber stringToAdd);
}
return(
<>
...
<Pressable style={styles.key} onPress={addNumber('addition')}>
<Text>Add</Text>
</Pressable>
...
</>
);
}
這不起作用。它說我正在重新渲染 React 的限制。
我想概括一下,因為我有 12 Pressable。我不喜歡 React 和 Javascript,所以我肯定錯過了一些東西。
uj5u.com熱心網友回復:
您addString在渲染組件時立即呼叫并更新狀態。您可以通過回傳進行更新的函式來使其變得懶惰。
function addString(stringToAdd) {
return () => setNumber(number => number stringToAdd);
}
uj5u.com熱心網友回復:
您addString在onPress方法中直接在初始化時呼叫函式
onPress={addString('addition')}
這將不必要地addString在每次重新渲染時呼叫該函式。與其這樣稱呼,不如像下面那樣
onPress={()=>addString('addition')}
請注意()=>.
這addString只會在按下按鈕時呼叫該方法。
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/334696.html
