Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Error:Element type is invalid:expected a string(for built-in components) or a class/function(for composite components)but got:undefined.you likely forget to export your component from the file it's defined in,or you might have mixed up default and named imports. <TabNavigator.Item> #203

Open
afckd opened this issue May 30, 2020 · 0 comments

Comments

@afckd
Copy link

afckd commented May 30, 2020

hi friends
I am a freshman to RN.
i have a issue.

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

checke the render method of 'Main'
This error idlocated at:
in TabNavigatorItem (at main.js:32)
...

<TabNavigator.Item>

this main.js code:
`import React, {Component} from 'react';
import {
View,
Text,
Button,
Image,
Platform,
StatusBar,
StyleSheet,
AppRegistry,
} from 'react-native';
import {Home} from '../home/home';
import {Find} from '../find/find';
import {Mine} from '../mine/mine';
import {More} from '../more/more';
//navigtionDrawble 导航栏首页
import TabNavigator from 'react-native-tab-navigator';
//路由
// import {Navigator} from 'react-native-deprecated-custom-components';
//equals fragment
export default class Main extends Component {

constructor(props) {
    super(props);
    this.state = {
        selectedTab: 'home',
    };
}

render() {
    return (
        <TabNavigator.Item
            title="首页"
            renderIcon={() => <Image source={require('../../res/images/icon_tabbar_homepage.png')}
                                     style={styles.iconStyle}/>}
            renderSelectedIcon={() => <Image
                source={require('../../res/images/icon_tabbar_homepage_selected.png')}
                style={styles.iconStyle}/>}
            badgeText="1"
            selected={this.state.selectedTab === 'home'}
            onPress={() => this.setState({selectedTab: 'home'})}
        >
            {<Home/>}
        </TabNavigator.Item>
    );
}

};

const styles = StyleSheet.create(
{
iconStyle: {
width: Platform.OS === 'ios' ? 30 : 25,
height: Platform.OS === 'ios' ? 30 : 25,
},
},
);
this my package.json{
"name": "meituan",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"react": "16.11.0",
"react-native": "0.62.2",
"react-native-deprecated-custom-components": "^0.1.2",
"react-native-tab-navigator": "^0.3.4"
},
"devDependencies": {
"@babel/core": "^7.6.2",
"@babel/runtime": "^7.6.2",
"@react-native-community/eslint-config": "^0.0.5",
"babel-jest": "^24.9.0",
"eslint": "^6.5.1",
"jest": "^24.9.0",
"metro-react-native-babel-preset": "^0.58.0",
"react-test-renderer": "16.11.0"
},
"jest": {
"preset": "react-native"
}
}
`
please help me,who know this problem how fix?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant