可以通过以下步骤实现:
import React, { useState } from 'react';
import { View, Text, Button } from 'react-native';
const ScreenA = ({ navigation }) => {
const [refresh, setRefresh] = useState(false);
const handleGoBack = () => {
setRefresh(true);
navigation.goBack();
};
return (
<View>
<Text>Screen A</Text>
<Button title="Go Back" onPress={handleGoBack} />
</View>
);
};
export default ScreenA;
import React, { useFocusEffect } from 'react';
import { View, Text } from 'react-native';
const ScreenB = ({ navigation }) => {
useFocusEffect(
React.useCallback(() => {
navigation.navigate('ScreenA');
}, [])
);
return (
<View>
<Text>Screen B</Text>
</View>
);
};
export default ScreenB;
在这个例子中,当从屏幕A导航到屏幕B时,屏幕B会使用useFocusEffect钩子来监听屏幕的聚焦事件,并在聚焦时通过navigation.navigate('ScreenA')来返回屏幕A。这将触发屏幕A的handleGoBack函数,其中设置了refresh状态为true,从而刷新屏幕A。
这种方法可以确保在返回屏幕A时刷新屏幕,以便更新数据或UI。如果需要进一步优化性能,可以考虑使用React Native的Context或Redux来管理状态和数据流。
领取专属 10元无门槛券
手把手带您无忧上云