reactjs中的一个新功能,正在使用react-redux开发一个小的注册功能,但是正面临这个错误。我正在遵循某个教程,但现在似乎卡住了
下面是我的代码:
Signup.js
import React, { Component } from 'react';
import NavBar from './subcomponents/NavBar'
import SignUpForm from './subcomponents/SignUpForm'
import { connect } from 'react-redux'
import {userSignUpRequest} from "./actions/signUpActions";
import PropTypes from 'prop-types';
class Signup extends Component {
render() {
const {userSignUpRequest} = this.props;
return (
<div>
<NavBar/>
<SignUpForm userSignUpRequest={userSignUpRequest}/>
</div>
);
}
}
Signup.propTypes = {
userSignUpRequest: PropTypes.func.isRequired
}
export default connect(null, { userSignUpRequest })(Signup);
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import './redux-js/index';
import App from "./App";
import {applyMiddleware, createStore} from "redux";
import thunk from "redux-thunk";
const store = createStore(
(state = {}) => state,
applyMiddleware(thunk)
);
ReactDOM.render(
<provider store={store}>
<App />
</provider>
, document.getElementById('root'));
答案 0 :(得分:1)
错误
在上下文或道具中找不到“商店” “连接(注册)”。 将根组件包装在
<Provider>
中,或者 明确地将“商店”作为道具传递给“连接(注册)”
解决方案
您需要在您的index.js
文件中导入 Provider :
import React from 'react';
import ReactDOM from 'react-dom';
import './redux-js/index';
import App from "./App";
import {applyMiddleware, createStore} from "redux";
import thunk from "redux-thunk";
import { Provider } from 'react-redux'; //added
const store = createStore(
(state = {}) => state,
applyMiddleware(thunk)
);
ReactDOM.render(
<Provider store={store}> //fixed typo
<App />
</Provider >
, document.getElementById('root'));
答案 1 :(得分:1)
您需要使用从App
导入的Provider
组件包装'react-redux'
组件
import { Provider } from 'react-redux';
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>
, document.getElementById('root'));