Warning: React.createElement: type is invalid — expected a string (for built-in components) or a class/function

[labikekoko]

import React, { Component } from 'react';
import {
    AppRegistry,
    TabBarIOS,
    FlatList
    TouchableHighlight,
    Image,
    Dimensions,
    StyleSheet,
    Text,
    View
} from 'react-native';
import Icon from 'react-native-vector-icons/Ionicons';

const width = Dimensions.get('window').width

class ChatList extends Component{
    constructor(props){
        super(props)
        this.state = {
            data: [
                {
                    "id":"230000201707307019",
                    "thumb":"http://dummyimage.com/600x300/058a9d)",
                    "video":"http://p.you.video.sina.com.cn/swf/opPlayer20180330_V5_1_1_63.swf?v=1523591005626"
                },
                {
                    "id":"150000200110173287",
                    "thumb":"http://dummyimage.com/600x300/3594ad)",
                    "video":"http://p.you.video.sina.com.cn/swf/opPlayer20180330_V5_1_1_63.swf?v=1523591005626"
                }
            ],
        }
    }
    _renderItem = (item, index) => {
        return(
            <TouchableHighlight>
                <View style={styles.item}>
                    <Text style={styles.title}>{item.id}</Text>
                    <Image
                        source={{uri: item.thumb}}
                        style={styles.img}
                    >
                        <Icon
                            name='ios-play'
                            size={25}
                            style={styles.play}
                        />
                    </Image>
                    <View style={styles.itemFooter}>
                        <View style={styles.itemFooterBox}>
                            <Icon
                                name='ios-heart-outline'
                                size={25}
                                style={styles.up}
                            />
                            <Text style={styles.handlerText}>点赞</Text>
                        </View>
                        <View style={styles.itemFooterBox}>
                            <Icon
                                name='ios-chatboxes-outline'
                                size={25}
                                style={styles.comment}
                            />
                            <Text style={styles.handlerComment}>评论</Text>
                        </View>
                    </View>
                </View>
            </TouchableHighlight>
        )
    }
    _keyExtractor = (item, index) => index
    render(){
        return(
            <View style={styles.container}>
                <View style={styles.header}>
                    <Text style={styles.headerTitle}>Header</Text>
                </View>
                <FlatList
                    data={this.state.data}
                    renderItem={this._renderItem}
                    keyExtractor={this._keyExtractor}
                />
            </View>
        )
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#F5FCFF',
    },
    header: {
        paddingTop: 25,
        paddingBottom: 15,
        backgroundColor: '#ee735c'
    },
    headerTitle: {
        color: '#fff',
        fontSize: 15,
        fontWeight: '600',
        textAlign: 'center'
    },
    item: {
        width: width,
        marginBottom: 10,
        backgroundColor: '#fff'
    },
    title: {
        padding: 10,
        fontSize: 18,
        color: '#333'
    },
    img: {
        width: width,
        height: width * 0.5,
        resizeMode: 'cover'
    },
    play: {
        position: 'absolute',
        bottom: 14,
        right: 14,
        width: 46,
        height: 46,
        paddingTop: 9,
        paddingLeft: 18,
        backgroundColor: 'transparent',
        borderColor: '#fff',
        borderWidth: 1,
        borderRadius: 23,
        color: '#ed7b66'
    },
    itemFooter: {
        flexDirection: 'row',
        justifyContent: 'space-between',
        backgroundColor: '#eee'
    },
    itemFooterBox: {
        padding: 10,
        flexDirection: 'row',
        width: width / 2 - 0.5,
        justifyContent: 'center',
        backgroundColor: '#fff'
    },
    handlerText: {
        color: '#333',
        paddingLeft: 12,
        fontSize: 18
    },
    up: {
        color: '#333',
        fontSize: 22
    },
    handlerComment: {
        color: '#333',
        fontSize: 22
    }
})


export default ChatList

哪里出错了，说是得到了一个 object, 本应该是 class/function

[labikekoko]

已发现问题，根组件里用`const x = require('../xxx')` 引入的第三方包

[toma77]

@labikekoko 我也是用的 require，以为没有 @types 声明，请问你后来怎么解决的呢