React-Native type is invalid — expected a string

huangapple go评论56阅读模式
英文:

React-Native type is invalid -- expected a string

问题

I'm starting with react native and I find the next mistake, I'm a little disoriented.

From App.js I import the component Home.js, but I get the following error:

### ERROR #################

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components)
but got: %s.%s%s, undefined, You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

#### App.js #############

import React, { Component } from 'react';
import { StyleSheet, Text, View, TextInput, TouchableOpacity } from 'react-native';

import { Home } from './componentes/Home';

export default class App extends Component {

render(){
return(



);
}

### ./componentes/Home.js ###########

import React, { Component } from 'react';
import { StyleSheet, Text, View, TextInput, TouchableOpacity } from 'react-native';

export default class Home extends Component{
render() {
return (
Home
);
}
}

英文:

I'm starting with react native and I find the next mistake, I'm a little disoriented.

From App.js I import the component Home.js, but I get the following error:

### ERROR #################

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components)
but got: %s.%s%s, undefined, You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

#### App.js #############

import React, { Component } from 'react';
import { StyleSheet, Text, View, TextInput, TouchableOpacity } from 'react-native';

import { Home } from './componentes/Home';

export default class App extends Component {

  render(){
    return(
      <View>
        <Home />
      </View>
  );
}

### ./componentes/Home.js ###########

import React, { Component } from 'react';
import { StyleSheet, Text, View, TextInput, TouchableOpacity } from 'react-native';

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

答案1

得分: 1

只需在你的 App.js 中修改导入 Home 组件的方式,从:

import { Home } from './componentes/Home';

改为:

import Home from './componentes/Home';

希望能帮助你,有疑问请随时提问。

英文:

Just in your App.js change your way of importing Home to ,

import  Home  from './componentes/Home';

AND NOT THE ONE BELOW

import { Home } from './componentes/Home';

hope it helps , feel free for doubts

huangapple
  • 本文由 发表于 2020年1月3日 21:17:03
  • 转载请务必保留本文链接:https://go.coder-hub.com/59579268.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定