【问题标题】：Redux/React: You must pass a component to the function returned by connect. Instead received {}Redux/React：您必须将组件传递给 connect 返回的函数。而是收到 {}
【发布时间】：2018-10-05 23:57:31
【问题描述】：

我是 react/redux 的新手。使用 create-react-app 创建项目后，我修改了 index.js 和 App.js：

index.js

import React from 'react';
import ReactDOM from 'react-dom';

import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';

import { Provider } from 'react-redux';
import { createStore } from 'redux';

function reducer() {
    return {
        message: 'hello, world'
    };
}

const store = createStore(reducer);

ReactDOM.render(
  <Provider store={store}>
  <App />
  </Provider>, 
  document.getElementById('root')
)

registerServiceWorker();

App.js

import React, { Component } from 'react';
import './App.css';
import { connect } from "react-dedux";

class App extends Component {
  render() {
    return (
      <div>
        <p>The message: {this.props.msg}</p>
      </div>
    );
  }
}


function mapStateToProps(state) {
  return {
    msg: state.message
  };
}

export default connect(mapStateToProps)(App);

这是我正在尝试的最简单的演示版本。错误消息是“您必须将组件传递给连接返回的函数。而不是收到 {}”。我一直在将我的代码与相当多的教程进行比较，但找不到根本原因。

【问题讨论】：

标签： react-redux

【解决方案1】：

我不敢相信，我的代码是

import { connect } from "react-dedux";

而正确的包名是 react-redux。所以在我把它改成

import { connect } from "react-redux";

有效！至少它证明我是在绑定代码，而不是复制粘贴。这个自动完成功能欺骗了我。

【讨论】：