Question

我是react-native的新手，并尝试使用expo-cli尝试我的第一个应用程序，我试图使用react导航在屏幕之间跳转，但是尝试导入屏幕组件（即HomeScreen）时遇到问题。

我遇到以下错误：

Unable to resolve "/screens/HomeScreen.js" from "App.js"

我的文件夹结构如下： https://i.imgur.com/c2gqTFt.png

这是我的App.js文件：

import { StatusBar } from 'expo-status-bar';
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { createStackNavigator } from '@react-navigation/stack';
import HomeScreen from '/screens/HomeScreen';

const navigator = createStackNavigator(
{
    Home: HomeScreen
},
{
  initialRouteName:'Home',
  defaultNavigationOptions:
  {
    title:'App'
  }

}
);

我的HomeScreen组件：

import * as React from 'react';
import { View, Text } from 'react-native';


export default function HomeScreen()
{
  return (
    <View style={styles.container}>
      <Text>Pero esto que es</Text>
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Answer 1

import HomeScreen from './screens/HomeScreen';

在开头添加./意味着您可以开始浏览所在的文件夹。

如果需要返回室外，则应添加../

因此，从App.js开始，现在您需要导航到HomeScreen所在的文件夹。

无法在React-Native中导入组件

1 个答案: