react-native - 堆栈导航器在发布 apk 中不起作用

Question

在这里，我正在尝试实现一个嵌套导航，其中我有

• 底部标签导航器
• 其他几个屏幕。

我的应用程序在调试模式下工作正常，以下弹出窗口在调试模式下工作。

但是当我发布 apk 时它不起作用。我正在使用反应导航 v5。当我点击已发布 apk 中的按钮时，什么也没有发生。

主导航

import * as React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';

import Dashboard from '../screens/Dashboard';
import BottomTabs from './BottomTab';
import CreateTodo from '../screens/CreateTodo';
import EditTodo from '../screens/EditTodo';

const Stack = createStackNavigator();

const MainNav = () => {
  return (
    <NavigationContainer>
      <Stack.Navigator
      mode={'card'}
      screenOptions={{
        cardStyle: { backgroundColor: 'transparent' },
        cardOverlayEnabled: true,
        cardStyleInterpolator: ({ current: { progress } }) => ({
          cardStyle: {
            opacity: progress.interpolate({
              inputRange: [0, 0.5, 0.9, 1],
              outputRange: [0, 0.25, 0.7, 1],
            }),
          },
          overlayStyle: {
            opacity: progress.interpolate({
              inputRange: [0, 1],
              outputRange: [0, 0.5],
              extrapolate: 'clamp',
            }),
          },
        }),
      }}

      initialRouteName='BottomTabs'
      headerMode={'none'}
      // options={{ headerShown: false }}
      >
        <Stack.Screen name="BottomTabs" component={BottomTabs} />
        <Stack.Screen name="CreateTodo" component={CreateTodo} />
        <Stack.Screen name="EditTodo" component={EditTodo} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default MainNav;

底部标签导航

import * as React from 'react';
import {createMaterialBottomTabNavigator} from '@react-navigation/material-bottom-tabs';
import {
  widthPercentageToDP as wp,
  heightPercentageToDP as hp,
} from 'react-native-responsive-screen';

import FontAwesome from 'react-native-vector-icons/FontAwesome';
import Ionicons from 'react-native-vector-icons/Ionicons';
import AntDesign from 'react-native-vector-icons/AntDesign';

import Settings from './../screens/Settings';
import Dashboard from './../screens/Dashboard';
import Profile from './../screens/Profile';

const Tab = createMaterialBottomTabNavigator();

const BottomTabs = () => {
  return (
    <Tab.Navigator
      initialRouteName="Dashboard"
      activeColor="white"
      shifting={true}
      barStyle={{ 
        fontFamily: 'Lato-Black',
      }}>
      <Tab.Screen
        name="Dashboard"
        component={Dashboard}
        options={{
          tabBarLabel: 'Dashboard',
          fontFamily: 'Lato-Black',
          tabBarColor: '#6C70F4',
          tabBarIcon: ({color}) => (
            <FontAwesome name="tasks" color={color} size={wp(5.5)} />
          ),
        }}
      />

      <Tab.Screen
        name="Settings"
        component={Settings}
        options={{
          tabBarLabel: 'Settings',
          tabBarColor: 'red',
          tabBarIcon: ({color}) => (
            <Ionicons name="md-settings" color={color} size={wp(5.5)} />
          ),
        }}
      />
      <Tab.Screen
        name="Profile"
        component={Profile}
        options={{
          tabBarLabel: 'Profile',
          tabBarColor: 'teal',
          tabBarIcon: ({color}) => (
            <AntDesign name="profile" color={color} size={wp(5.5)} />
          ),
        }}
      />
    </Tab.Navigator>
  );
};

export default BottomTabs;

包.json

    {
  "name": "App Name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "@react-native-community/masked-view": "^0.1.10",
    "@react-navigation/material-bottom-tabs": "^5.2.7",
    "@react-navigation/native": "^5.4.2",
    "@react-navigation/stack": "^5.4.2",
    "react": "16.11.0",
    "react-native": "0.62.2",
    "react-native-gesture-handler": "^1.6.1",
    "react-native-paper": "^3.10.1",
    "react-native-reanimated": "^1.8.0",
    "react-native-responsive-screen": "^1.4.1",
    "react-native-safe-area-context": "^1.0.2",
    "react-native-screens": "^2.7.0",
    "react-native-vector-icons": "^6.6.0"
  },
  "devDependencies": {
    "@babel/core": "^7.9.6",
    "@babel/runtime": "^7.9.6",
    "@react-native-community/eslint-config": "^1.1.0",
    "babel-jest": "^26.0.1",
    "eslint": "^7.0.0",
    "jest": "^26.0.1",
    "metro-react-native-babel-preset": "^0.59.0",
    "react-test-renderer": "16.11.0"
  },
  "jest": {
    "preset": "react-native"
  }
}