React-Native选项卡导航错误:自动返回到访问的第一个底部选项卡

如果我在底部选项卡 1 内的顶部选项卡中导航,然后尝试转到底部选项卡 2,几秒钟后它将我带回初始的底部选项卡1

如果我在底部选项卡 1 内的顶部选项卡中导航,然后尝试转到底部选项卡 2,几秒钟后它将我带回初始的底部选项卡1

这些是我的依赖关系:“依赖关系”:“{”@ react-native-async-storage“4.n-react”中的 rnative ^-react-react 13.native ^-react-native ^-react-native ^-react-native ^-react-native ^-react-1.1-native ^-react-native-native-

这里的动画--& gt;http://tkdevolution.it/app-navigation-bug.gif

app.js:

<NavigationContainer onReady={() => RNBootSplash.hide({ fade: true })}>
          <AllAppNavigation.Navigator initialRouteName={initialRouteName} screenOptions={{header: () => null}}>
            <AllAppNavigation.Screen name="IndexScreen" children={IndexDrawerNavigator} />
            <AllAppNavigation.Screen name="HomeScreen" children={StackNavigator} initialParams={{gidcom: String(GIdCom), gdatacom: String(GDataCom)}} />
          </AllAppNavigation.Navigator>
        </NavigationContainer>

堆栈导航器:

<Stack.Navigator screenOptions={screenOptionStyle}>
      <Stack.Screen name="StackHome"
        component={BottomTabNavigator}
        initialParams={{screen:'TabHome', 
          // qui passiamo i parametri al bottom navigator perchè il context non è ancora caricato perchè è asincrono
          gidcom: idCom, 
          gdatacom: JSON.stringify(GDataCom)
        }}
        options={() => ({
          headerLeft: () => LogoComune(GDataCom),
          headerTitle: () => TitoloHeader(GDataCom),
          headerRight: () => DotsIcon(navigation)
        })}
      />
</Stack.Navigator>

选项卡导航器:

const MaterialTopNavigatorAvvisi = () => {
  return (
    <Tab2.Navigator>
      <Tab2.Screen name="InPrimoPiano" options={{tabBarLabel: 'In Primo Piano'}} component={AvvisiScreen} initialParams={{filtro: 'primopiano=true'}} />
      <Tab2.Screen name="Tutti" options={{tabBarLabel: 'Tutti'}} component={AvvisiScreen} initialParams={{filtro: ''}} />
    </Tab2.Navigator>
  );
}
const MaterialTopNavigatorEventi = () => {
  return (
    <Tab2.Navigator>
      <Tab2.Screen name="Oggi" options={{tabBarLabel: 'Oggi'}} component={EventiScreen} initialParams={{filtro: 'tipo=0'}} />
      <Tab2.Screen name="Futuri" options={{tabBarLabel: 'Futuri'}} component={EventiScreen} initialParams={{filtro: 'tipo=1'}} />
      <Tab2.Screen name="Principali" options={{tabBarLabel: 'Principali'}} component={EventiScreen} initialParams={{filtro: 'tipo=2'}} />
    </Tab2.Navigator>
  );
}

avvisiscreen:

const ItemView = ({item}, context) => {
    return (
      <ElementoLista item={item} colore={ColoreBase} destinazione='AvvisiDettaglio' />
      /* <Text>{item.Id + '. ' + item.Titolo}</Text> */
    );
  };
  useEffect(() => {
    fetch( BuildApiUrl("avvisi", idCom, null, filtro) )
      .then((response) => response.json())
      .then((json) => {setData(json)})
      .catch((error) => console.error(error))
      .finally(() => setLoading(false));
  }, []);
  const wait = (timeout) => {
    return new Promise(resolve => setTimeout(resolve, timeout));
  }
  const [refreshing, setRefreshing] = React.useState(false);
  const onRefresh = React.useCallback(() => {
    setRefreshing(true);
    wait(2000).then(() => setRefreshing(false));
  }, []);
  //occorre inserire un datafiltered come per la indexscreen, con questo filtro: (tipo=='0' && item.PrimoPiano=='true')
  //altrimenti utilizza il data originale, con tutti gli elementi non filtrati
  return (
    <SafeAreaView style={styles.center}>
      {isLoading ? <View style={[styles.container, styles.horizontal]}><ActivityIndicator size="large" /></View> : 
      ( <View style={styles.center}>
        {(data == '') ? <NoResultMsg/> : 
          (<FlatList
            data={data}
            keyExtractor={item => item.Id.toString()}
            renderItem={(item) => ItemView(item)}
            refreshControl={
              <RefreshControl
                refreshing={refreshing}
                onRefresh={onRefresh}
              />
            }
            /* ItemSeparatorComponent={ItemSeparatorView} */
            /* showsVerticalScrollIndicator={false}
            showsHorizontalScrollIndicator={false} */
          />)}
        </View>
      )}
    </SafeAreaView>
  );
};

本站系公益性非盈利分享网址,本文来自用户投稿,不代表码文网立场,如若转载,请注明出处

(416)
在CSSflexbox中 宽度:50%和flex:50%之间的区别
上一篇
要为.NET6服务器项目安装哪个SignalR包
下一篇

相关推荐

发表评论

登录 后才能评论

评论列表(12条)