TypeError:无法读取未定义的属性“ getState”

时间:2020-02-09 12:22:22

标签: reactjs redux

**

TypeError:无法读取未定义的属性'getState',我找不到解决方案。您会看我的代码吗?您认为解决方案应该如何?**


index.jsx

 import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import {createStore} from 'redux';
import rootReducer from './store/reducers/rootReducer';
import {Provider} from 'react-redux';


const store=createStore(rootReducer);


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

provider.js

    import React, { useMemo, useEffect } from 'react';
import PropTypes from 'prop-types';
import { ReactReduxContext } from './Context';
import Subscription from '../utils/Subscription';

function Provider(_ref) {
  var store = _ref.store,
      context = _ref.context,
      children = _ref.children;
  var contextValue = useMemo(function () {
    var subscription = new Subscription(store);
    subscription.onStateChange = subscription.notifyNestedSubs;
    return {
      store: store,
      subscription: subscription
    };
  }, [store]);
  var previousState = useMemo(function () {
    return store.getState();
  }, [store]);
  useEffect(function () {
    var subscription = contextValue.subscription;
    subscription.trySubscribe();

    if (previousState !== store.getState()) {
      subscription.notifyNestedSubs();
    }

    return function () {
      subscription.tryUnsubscribe();
      subscription.onStateChange = null;
    };
  }, [contextValue, previousState]);
  var Context = context || ReactReduxContext;
  return React.createElement(Context.Provider, {
    value: contextValue
  }, children);
}

Provider.propTypes = {
  store: PropTypes.shape({
    subscribe: PropTypes.func.isRequired,
    dispatch: PropTypes.func.isRequired,
    getState: PropTypes.func.isRequired
  }),
  context: PropTypes.object,
  children: PropTypes.any
};
export default Provider;

projectlist.jsx

 import React from 'react';
import ProjectSummary from './ProjectSummary';

const ProjectList = ({projects}) => {

    return (
        <div className="project-list secion">

{projects && projects.map(project=>{
    return(
        <ProjectSummary project={project} key={projects.id} />
    )
})}

        </div>
    )
}
export default ProjectList;

rootReducer.jsx

import authReducer from './authReducer';
import projectReducer from './projectReducer';
import {combineReducers} from 'redux';

const rootReducer=combineReducers({

    auth:authReducer,
    project:projectReducer
})

export default rootReducer  

**************************

authreducer.jsx

const initState={}

const authReducer=(state=initState,action)=>{
return state

}
export default authReducer

projectreducer.jsx

 const initState={

    projects:[
        {id:1,baslik:'React Yazılım',icerik:'Geliştirme'},
        {id:1,baslik:'Redux Yazılım',icerik:'Geliştirme'},
        {id:1,baslik:'Firebase Yazılım',icerik:'Geliştirme'}
    ]
}

const projectReducer=(state=initState,action)=>{
return state

}
export default projectReducer

authreducer.jsx

    const initState={}

const authReducer=(state=initState,action)=>{
return state

}
export default authReducer

package.json

    {
  "name": "omaga-yazilim",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.4.0",
    "@testing-library/user-event": "^7.2.1",
    "firebase": "^5.5.8",
    "jest-leak-detector": "^25.1.0",
    "moment": "^2.22.2",
    "react": "^16.6.3",
    "react-dom": "^16.6.3",
    "react-redux": "^5.1.1",
    "react-redux-firebase": "^2.2.1",
    "react-router-dom": "^4.3.1",
    "react-scripts": "2.1.1",
    "redux": "^4.0.1",
    "redux-firestore": "^0.6.0",
    "redux-thunk": "^2.3.0",
    "start": "webpack-dev-server --mode development"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

1 个答案:

答案 0 :(得分:1)

商店必须作为道具传递给<Provider>

index.jsx

<Provider>store={store}<App /></Provider>

          ^^^^^^^^^^^^^
             ooops! ?

store应该在>标签之前和内部:

<Provider store={store}><App /></Provider>