最近我开始学习如何使用 React Native 构建移动应用程序,这是我从一位 friend 那里听到的,我对此非常感兴趣。但现在我遇到了错误,并尝试从谷歌搜索解决方案,但没有一个可以解决我的问题。我的问题是,当我将其他组件导入 index.android.js 时,它在移动屏幕上显示错误 =>
The development server returned response error code: 500
我的组件存储在文件夹 android => android/app/components/Bar.js
我是这样导入的
import Bar from './app/components/Bar';
index.android.js
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
View
} from 'react-native';
import Bar from './app/components/Bar';
export default class ProfilePageApp extends Component {
render() {
return (
<View style={styles.container}>
<Bar />
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#000',
}
});
AppRegistry.registerComponent('ProfilePageApp', () => ProfilePageApp);
Bar.js
import React, { Component } from 'react';
import {
View,
Text
} from 'react-native';
class Bar extends Component {
render() {
return (
<View style={styles.container}>
<Text>Hello world</Text>
</View>
);
}
}
export default Bar;
错误
最佳答案
我不确定 RN 在文件目录约定方面到底是如何工作的,但我认为它与 React 等其他内容几乎相同。但是,当我阅读您的代码时,我认为您在 import
语句中缺少 ./android
。
您提到:
My components are stored in folder android => android/app/components/Bar.js
但是你像这样导入了它:
import Bar from './app/components/Bar';
你试过吗
import Bar from './android/app/components/Bar';
?
关于javascript - 无法在 React Native 中导入其他组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44642619/