React.createElement:类型无效,预期为字符串(对于内置组件)或类/函数(对于复合组件),但得到:%s。%s%s,

时间:2020-08-06 06:47:53

标签: react-native

React.createElement:类型无效-预期为字符串(对于 内置组件)或类/函数(用于复合组件) 但得到:%s。%s%s,未定义,您可能忘记了导出 定义文件中的组件,否则您可能混淆了 默认导入和命名导入。

在App.js:10中检查您的代码, 在App中(由ExpoRoot创建) 在RCTView中(在NativeAppearance.tsx:4) 在FallbackAppearanceProvider中(位于src / index.tsx:70) 在AppearanceProvider中(由ExpoRoot创建) 在RootErrorBoundary中(由ExpoRoot创建) 在ExpoRoot中(在renderApplication.js:45) 在RCTView中(位于AppContainer.js:109) 在RCTView中(位于AppContainer.js:135) 在AppContainer中(在renderApplication.js:39)

出口代码在那里。请问代码中有什么问题?

App.js代码

import { StatusBar } from "expo-status-bar";
import React from "react";
import { StyleSheet, Text, View } from "react-native";
import { HotelComp } from "./components/hotel";

export default function App() {
  return (
    <View style={styles.container}>
      <Text>Open up App.js to start working on your app!</Text>
      <HotelComp />
      <StatusBar style="auto" />
    </View>
  );
}

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

hotel.js代码

import React, { Component } from "react";
import { Text, View } from "react-native";

export class hotel extends Component {
  render() {
    return (
      <View>
        <Text> hotel Component </Text>
      </View>
    );
  }
}

export default hotel;

1 个答案:

答案 0 :(得分:0)

您将类导出了两次,并且正在导入hotelComp,而不是hotel。尝试使用hotel.js:

export default class hotel extends Component {
  render() {
    return (
      <View>
        <Text> hotel Component </Text>
      </View>
    );
  }
}

并像这样导入它(假设hotel.js文件位于/ components文件夹中):

import hotel from "./components/hotel"