错误：忘了导出列表视图项组件

警告：React.createElement：类型无效 - 预期字符串（用于内置组件）或类/功能（复合组件），但得到：不确定。你可能忘了你的组件从它的定义的文件导出检查你的代码在 BookingPage.js：19。

我有一个ListView和项目组件正确导入。当我改变了ListView项的出口从

export default connect(mapStateToProps, {callCancel, setBookingstatus})(BookingCard);

到

export {BookingCard};

它的工作。但我想为Listview项目组件使用redux。如何正确导出类。这是我的BookingCard（ListView项分量）

import React from 'react'; 
    import {View, Text, StyleSheet, TouchableOpacity} from 'react-native'; 
    import { connect } from 'react-redux'; 
    import {Icon, Button} from 'native-base'; 
    import {callCancel, setBookingstatus} from '../actions'; 

    class BookingCard extends React.Component { 
     render() { 
     return (
      <View style={styles.container}> 
       ..... 
       ...... 
      </View> 
     ); 
     } 
    } 

    export default connect(mapStateToProps, {callCancel, setBookingstatus})(BookingCard); 
    // export {BookingCard};

BookingPage（组件包括列表视图）

import React from 'react'; 
import {ListView, View} from 'react-native'; 
import { connect } from 'react-redux'; 
import {Spinner} from './common'; 
import {BookingCard} from './BookingCard'; 
import {fetchBooking} from '../actions'; 

class BookingPage extends React.Component { 

    componentWillMount() { 
     this.props.fetchBooking(); 
    } 

    ds = new ListView.DataSource({ 
     rowHasChanged: (r1, r2) => r1 !== r2 
    }); 

    renderRow(booking) { 
     return <BookingCard booking={booking} />; 
    } 

    renderButton() { 
     if (this.props.loading) { 
      return <Spinner size="large" />; 
     } 
      return (
       <ListView 
        dataSource={this.ds.cloneWithRows(this.props.bookings)} 
        enableEmptySections 
        renderRow={this.renderRow} 
       /> 
      ); 
    } 

    render() { 
     console.log('onRender BookingPage'); 
     return (
      <View> 
       {this.renderButton()} 
      </View> 
     ); 
    } 
} 

const mapStateToProps = ({ booking }) => { 
    const { bookings, loading } = booking; 
    return { bookings, loading }; 
}; 

export default connect(mapStateToProps, {fetchBooking})(BookingPage);

来源

2017-08-31 Anjal Saneen

你能告诉你，当它连接你如何导入项列表组件 – eden

它可能是因为你出口的默认。 – eden

含进口也增加@Eden类。你能帮我吗？即时通讯本身就是非常初学者。 –

既然要导出您的组件默认这样的：

export default connect(mapStateToProps, {callCancel, setBookingstatus})(BookingCard);

的因为它需要一个名为export以下线路出现故障。

import {BookingCard} from './BookingCard';

您应该解决您的导入是这样的：

import BookingCard from './BookingCard';

或导出它像

export const MyConnectedComponent = connect(mapStateToProps, {callCancel, setBookingstatus})(BookingCard);

您可以在更MDN's website找出来。

来源

2017-08-31 08:54:55 eden

错误：忘了导出列表视图项组件

回答

相关问题