react-native - 导航到屏幕后 react 抽屉导航重新打开

Question

我正在开发一个简单的应用程序，现在已经添加了抽屉导航，但是我遇到了一个奇怪的问题，抽屉在从抽屉内容导航到屏幕后再次打开。

PlayerZone 是一个包含个人资料和其他屏幕的 BottomTabNavigation。我尝试在导航到屏幕之前和之后发送关闭抽屉操作，我也尝试了 requestAnimationFrame 但没有任何帮助。

how it looks like

抽屉屏幕:

<Animated.View style={[styles.stack, style]}>
  <Stack.Navigator
    screenOptions={{
      header: () => null,
    }}>
    <Stack.Screen name="PlayerZone" component={PlayerZone} />
  </Stack.Navigator>
  <GameBottomNavigation />
</Animated.View>

抽屉:

<DrawerItem
  label="Profile"
  style={styles.item}
  labelStyle={styles.itemLabel}
  onPress={() => {
    props.navigation.navigate('PlayerZone', {
      screen: 'Profile',
      id: null,
    });
  }}
/>
<DrawerItem
  label="Items"
  style={styles.item}
  labelStyle={styles.itemLabel}
  onPress={() => {
    props.navigation.navigate('PlayerZone', {
      screen: 'Profile',
      id: 'some-id',
    });
  }}
/>

玩家专区:

<Tab.Navigator
  initialRouteName="Profile"
  screenOptions={{
    header: () => null,
  }}>
  <Tab.Screen name="Profile" component={Profile} />
  {!peeking && <Tab.Screen name="Items" component={Items} />}
</Tab.Navigator>

项目:

import React, {FC} from 'react';
import {BottomTabScreenProps} from '@react-navigation/bottom-tabs';

import Block from '../../components/Block';
import Text from '../../components/Text';

import {PlayerZoneTabParamList} from '.';

type Props = BottomTabScreenProps<PlayerZoneTabParamList, 'Items'>;
const Items: FC<Props> = () => {
  return (
    <Block middle center>
      <Text>Items</Text>
    </Block>
  );
};

export default Items;

Answer 1

所以在尝试了我能想到的一切之后，我找到了解决方案(某种程度上)。在抽屉导航器中，我将 Prop useLegacyImplementation 设置为 false，因为我已经配置了 reanimated 2。我删除了这个 Prop ，一切都开始正常工作。