NavigationContainer中的本机错误

问题描述 投票:0回答:1

由于我是react-native的新手,我只是想在react-native中构建一个可以导航的简单应用。

index.js

import React from 'react';
import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';
import 'react-native-gesture-handler';
import {NavigationContainer} from '@react-navigation/native';
import Login from './Login';
import createStackNavigator from '@react-navigation/stack/src/navigators/createStackNavigator';

const Stack = createStackNavigator();

function MyStack() {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        <Stack.Screen
          name="Home"
          component={App}
          options={{title: 'Welcome'}}
        />
        <Stack.Screen name="Profile" component={Login} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

AppRegistry.registerComponent(appName, MyStack);

现在它给我错误:

enter image description here

如果我包装那个MyStack,它将给我另一个错误:

enter image description here

我的[[package.json:

"dependencies": { "@freakycoder/react-native-helpers": "^0.1.2", "@react-native-community/masked-view": "^0.1.6", "@react-navigation/native": "^5.0.6", "@react-navigation/stack": "^5.0.6", "react": "16.9.0", "react-native": "0.61.5", "react-native-dynamic-vector-icons": "^0.2.1", "react-native-gesture-handler": "^1.6.0", "react-native-improved-text-input": "^0.0.1", "react-native-login-screen": "^0.3.6", "react-native-safe-area-context": "^0.7.3", "react-native-screens": "^2.0.0-beta.8", "react-native-spinkit": "^1.5.0", "react-native-splash-screen": "^3.2.0", "react-native-vector-icons": "^6.6.0" }, "devDependencies": { "@babel/core": "^7.8.4", "@babel/runtime": "^7.8.4", "@react-native-community/eslint-config": "^0.0.7", "babel-jest": "^25.1.0", "eslint": "^6.8.0", "jest": "^25.1.0", "metro-react-native-babel-preset": "^0.58.0", "react-test-renderer": "16.9.0" },
在我的app/build.gradle中,我添加了这两个:

implementation 'androidx.appcompat:appcompat:1.1.0-rc01' implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0-alpha02'

也重新启动并且使缓存无效。
react-native react-navigation
1个回答
0
投票
错误是因为AppRegistry.registerComponent接受了返回组件的函数,但是您正在传递组件。

更改

AppRegistry.registerComponent(appName, MyStack);

to

AppRegistry.registerComponent(appName, () => MyStack);

您也从错误的位置导入createStackNavigator。您需要这样导入:

import { createStackNavigator } from '@react-navigation/stack';

© www.soinside.com 2019 - 2024. All rights reserved.