在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML5/ type is invalid — expected a string (for

type is invalid — expected a string (for built-in components)

react-native 報(bào)錯(cuò)
Warning: React.createElement: type is invalid — expected a string (for built-in components) or a class/function

img

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}>點(diǎn)贊</Text>
                        </View>
                        <View style={styles.itemFooterBox}>
                            <Icon
                                name='ios-chatboxes-outline'
                                size={25}
                                style={styles.comment}
                            />
                            <Text style={styles.handlerComment}>評(píng)論</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

網(wǎng)上答案都是 如果用
import ... from ...

export default ...

如果用
require('../xxx')
要換成
module.exports = xxx

我發(fā)現(xiàn)我這段代碼問(wèn)題好像不在這里,但又不知道哪里出了問(wèn)題,總會(huì)得到這個(gè)錯(cuò)誤?

回答
編輯回答
荒城

已解決,

在上面這段代碼里,我用import ...

但是 在入口組建里卻用了 const a = require('../')引入的第三方組件

自己把自己玩哭了

2018年3月12日 12:46