我是新来的反应/ redux。使用create-react-app创建项目后,我修改了index.js和App.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();
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);
这是我正在尝试的最简单的演示版本。 错误消息是“您必须将组件传递给connect返回的函数。而不是收到{}”。我一直在将我的代码与许多教程进行比较,但找不到根本原因。
答案 0 :(得分:0)
我不敢相信,我的代码是
import { connect } from "react-dedux";
,而正确的软件包名称是react-redux。因此,在将其更改为
之后import { connect } from "react-redux";
有效!至少证明我是在绑代码,而不是粘贴粘贴。这种自动完成功能欺骗了我。