expo 错误“元素类型无效:预期是字符串(对于内置组件)或类/函数(对于复合组件),但得到:对象。”

时间:2021-07-02 06:29:38

标签: javascript reactjs react-native

我正在使用 react native 进行 expo 并收到以下错误。我不确定是什么导致了它以及错误的确切含义。

我确实单独运行了这些文件,但它们运行良好。 expo 错误“元素类型无效:预期是字符串(对于内置组件)或类/函数(对于复合组件),但得到:对象。”

enter image description here

App.js 代码

import * as React from 'react';
import {
  Text,
  View,
  StyleSheet,
  TouchableOpacity,
  ScrollView,
} from 'react-native';
import Constants from 'expo-constants';
import Header from './components/Header.js';
import Body2 from './components/Body2.js';
import { Card } from 'react-native-paper';
import DisplayAnImage from '/components/mapimage.js';

export default function App() {
  return (
    <View>
      <Header />
      <DisplayAnImage />
    </View>
  );
}

Header.js 的代码

import { Text,Button,SafeAreaView, View, StyleSheet, Image } from 'react-native';

function Header()
{
  return (

    <View style={styles.container}>
    <View style={styles.fixToText}>
      <Text style={styles.text}>TaskStatus : Scheduled</Text>
       <Button
          title="History" style={styles.buton}
          /*onPress={History}*//>
        </View>
    </View>
  );
}
const styles = StyleSheet.create({
  container: {
    marginHorizontal: 16,
    margin: 5,
    marginTop:30,
  },
  text: {
    marginTop:10,
    fontSize: 16,
    fontWeight: 'bold',
    textAlign: 'left',
  },
  fixToText: {
    flexDirection: 'row',
    justifyContent: 'space-between',
  },
  buton:
  {
    width:20,
    height:20,
    margin:20,
  }
});

export default Header;

DisplayImage 代码

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

const styles = StyleSheet.create({
  container: {
    paddingTop: 50,
  },
  map: {
    width: 200,
    height: 200,
  },
});

const DisplayAnImage = () => {
  return (
    <View style={styles.container}>
      <Image
        style={styles.map}
        source={{
          uri:
            'https://i0.wp.com/cssscript.com/wp-content/uploads/2018/03/Simple-Location-Picker.png?fit=561%2C421&ssl=1',
        }}
      />
    </View>
  );
};

export default DisplayAnImage;

0 个答案:

没有答案