react-native - 路由 'Detail' 的组件必须是 React 组件

Question

我正在react native使用“expo”在我的设备上运行模拟器的项目中工作我遇到错误并尝试解决可能多次但失败这里是我的错误链接

应用程序.js

import React from 'react';
import MovieList from './components/list';
import  Detail from './components/detail';


import { createAppContainer } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';

const AppNavigator = createStackNavigator({
  MovieList: {screen: MovieList},
  Detail: {screen: Detail},

})

const App = createAppContainer(AppNavigator);

export default App();

细节.js

import React from 'react';
import { StyleSheet, Text, View, FlatList, Image } from 'react-native';

export default function Detail() {

  return (
    <View>
   <Text>Details</Text>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    alignItems: "center",
    justifyContent: "center"
  },
  item: {
    flex: 1,
    padding: 10,
    height: 50,
    backgroundColor: '#282C35'
  },
  itemText: {
color: '#fff',
fontSize: 24
  }
});

标签： react-nativeexpo

Answer 1

错误在这里

const AppNavigator = createStackNavigator({
  MovieList: {screen: MovieList},
  Detail: {screen: **Detail**},

})

因为您将Detail声明为一个函数。StackNavigator需要组件_

例如

import React, { Component } from "react";
class Detail extends Component {
// Your Code

}

这如何工作正常使用组件而不是功能。