我有一個平面串列,我將它與備忘錄一起使用。
螢屏 1.js 組件
<FlatList
data={props.cars.results}
renderItem={(item)=> <SinleRowMemo item={item}/>}
/>
在 SingleRow.js 組件中;
export const SingleRow=(props.item)=>{
return (
<TouchableOpacity onPress={()=>SomeFuncComesFromProps()}>
<View>
<Text>{props.car.brand}</Text>
</View>
</TouchableOpacity>
export const SingleRowMemo=React.memo(SingleRow)
應用程式.js
<Route path={"/"} component={<Screen 1/>}/>
<Route path={"/detail"} component={<Screen 2/>}/>
<Route path={"/about"} component={<Screen 3/>}/>
問題是,當我轉到“/detail”螢屏并回傳“/”頁面時,SingleRowMemo 函式再次重新運行并呈現已呈現的所有行。如何解決這個問題?謝謝
uj5u.com熱心網友回復:
這導致反應備忘錄掛鉤更改您的代碼如下
const SingleRow=(props.item)=>{
return (
<TouchableOpacity onPress={()=>SomeFuncComesFromProps()}>
<View>
<Text>{props.car.brand}</Text>
</View>
</TouchableOpacity>
export default SingleRow
uj5u.com熱心網友回復:
記憶并不會僅僅因為每行的引數都在變化而避免重新渲染。React.memo() 適用于經常使用相同引數渲染組件并且渲染成本相對較高的情況。
https://dmitripavlutin.com/use-react-memo-wisely/
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/368750.html
