您必须将组件传递给connect返回的函数.而是收到undefined

Question

下面的代码给出了

未捕获错误:您必须将组件传递给connect返回的函数.而是收到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>
}

请帮我解决一下？

Answer 1

您正在这样做import PostList from '../components/PostList';,您需要export default在PostList.js文件中使用.

否则你需要做import { PostList } from '../components/PostList';.

对于有兴趣的人,这里有一篇关于es6导入/导出语法的好文章:http://www.2ality.com/2014/09/es6-modules-final.html

Answer 2

与提问者具体无关，但如果您遇到此错误，则值得检查您的 connect() 语法是否正确：

const PreloadConnect = connect(mapStateToProps, {})(Preload);

export default PreloadConnect;

请注意，Preload是作为 IIFE 参数传递的。