Musisz przekazać komponent do funkcji zwróconej przez connect. Zamiast tego otrzymał niezdefiniowany

Question

Poniższy kod daje

Uncaught Error: You must pass a component to the function returned by connect. Instead received undefined

List.js

import React from 'react'; 
import { connect, bindActionCreators } from 'react-redux'; 
import PostList from '../components/PostList'; // Component I wish to wrap with actions and state 
import postList from '../Actions/PostList' //Action Creator defined by me 

const mapStateToProps = (state, ownProps) => { 
    return state.postsList 
} 

const mapDispatchToProps = (dispatch) => { 
    return bindActionCreators({"postsList":postList},dispatch) 
} 

export default connect(mapStateToProps, mapDispatchToProps)(PostList); 

PostList.js

import React from 'react' 

export const PostList = (props) => { 
    return <div>List</div> 
} 

Proszę mi pomóc w rozwiązaniu?

Answer 1

Wykonujesz import PostList from '../components/PostList';, więc musisz użyć export default w swoim pliku PostList.js.

W przeciwnym razie musisz wykonać import { PostList } from '../components/PostList';.

Aby każdy, kto jest zainteresowany, tutaj jest ładny artykuł o składni import ES6/eksportu: http://www.2ality.com/2014/09/es6-modules-final.html