所以，正如標題所說，我正在制作一個反應原生應用程式，我希望我離開的螢屏navigation.navigate()在我回到它時被“重置”或“重新渲染”，因為就像現在一樣，當我離開時螢屏然后回到它它的狀態與我離開它的狀態相同。這是導航器代碼
const Tab = createBottomTabNavigator();
export default function App() {
return (
<NavigationContainer>
<Tab.Navigator>
<Tab.Group>
<Tab.Screen name="Devices" component={Devices} options={{
tabBarIcon:({focused})=>(
<View style={{alignItems:'center', justifyContent:'center'}}>
<Image
source={require('./android/app/src/main/assets/devices.png')}
resizeMode='contain'
style={{
width: 30,
height: 30
}}
/>
</View>
)
}} />
<Tab.Screen name="Connection" component={ConnectionScreen} options={{
tabBarIcon:({focused})=>(
<View style={{alignItems:'center', justifyContent:'center'}}>
<Image
source={require('./android/app/src/main/assets/connection.png')}
resizeMode='contain'
style={{
width: 30,
height: 30
}}
/>
</View>
)
}} />
</Tab.Group>
<Tab.Group screenOptions={{ presentation: 'modal' }}>
<Tab.Screen name='Add device' component={AddDevice}
options={{
tabBarButton: () => null,
tabBarVisible:false
}}/>
</Tab.Group>
</Tab.Navigator>
</NavigationContainer>
);
}
第二個較小的事情是，我看不到任何導航影片，例如底部的這個模態
uj5u.com熱心網友回復：
設定unmountOnBlur為true
卸載螢屏會重置螢屏中的任何本地狀態以及螢屏中嵌套導航器的狀態。默認為
false.
<Tab.Navigator
screenOptions={{ unmountOnBlur: true }}
>
...
</Tab.Navigator>
此外，您可以將其應用于單個路線：
<Tab.Navigator>
<Tab.Screen name="..." component={...} options={{ unmountOnBlur: true }} />
</Tab.Navigator>
uj5u.com熱心網友回復：
您可以使用useIsFocused，嘗試類似：
import { useIsFocused } from '@react-navigation/native';
const isFocused = useIsFocused();
useEffect(() => {
//executes whenever this component/screen is focused
}, [isFocused]);
您還可以將unmountOnBlur標志設定為 true 到特定螢屏，如下所示：
<Tab.Screen
name={...}
component={...}
options={{unmountOnBlur: true}}
/>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/411159.html
標籤：
下一篇：修復這個ReactNative錯誤VirtualizedListcontainsacell，該單元本身包含多個VirtualizedList