无法访问 Reducer 和状态值

Unable to access Reducer & state values

我无法在任何屏幕上访问保存在商店中的状态值。值会影响到操作,但是当我从存储中访问它时,它 returns 始终未定义。 每件事都在单独的文件中

减速器 1

import * as Actions from '../actionTypes'
import initialStore from './initialStore'

const homeModuleReducer = (state = initialStore, action) => {
    switch (action.type) {
        case Actions.SET_PROFILE_ONE:
            console.log('call here')
            return {
                ...state,
                currentUser: action.profile
            }
        default:
            return state;
    }
}

export default homeModuleReducer

减速器 2

import * as Actions from '../actionTypes'
import initialStore from './initialStore'

const loginModuleReducer = (state = initialStore, action) => {
    switch (action.type) {
        case Actions.SET_PROFILE:
            return {
                ...state,
                currentUser: action.profile
            }
        case Actions.SET_INITIAL_LOADING_STATUS:
            return {
                ...state,
                isInitialLoadingDone: action.loadingStatus
            }
        default:
            return state;
    }
}

export default loginModuleReducer

联合减速器

import { combineReducers } from 'redux'
import homeModuleReducer from './homeModuleReducer'
import loginModuleReducer from './loginModuleReducer'

export default combineReducers({
    homeModuleReducer,
    loginModuleReducer,
})

商店

import { createStore, applyMiddleware } from 'redux'
import thunkMiddleware from 'redux-thunk';
import rootReducer from './reducers'

let store = createStore(rootReducer, applyMiddleware(thunkMiddleware));

export default store;

用法:

const mapStateToProps = (state) => ({
    stateLoaded: state.rootReducer.isInitialLoadingDone,
    profile: state.rootReducer.currentUser
});

错误:

undefined 不是对象(正在计算 'state.rootReducer.isInitialLoadingDone')

您已经组合了您的减速器,因此您可以像这样通过它的键访问减速器:

const mapStateToProps = (state) => ({
    stateLoaded: state.homeModuleReducer.isInitialLoadingDone, // here homeModuleReducer is just an example. Change with reducer key in which isInitialLoadingDone is belong
    profile: state.loginModuleReducer.currentUser
});

有了钩子就容易多了 用 store

包裹你的根
import {Provider} from 'react-redux';

const App = () => {    
    return (
    <Provider store={store}>
        <Yourcomponent/>
    </Provider>
  );
};

export default App;

像这样在任何组件中访问您的状态

import { useSelector } from "react-redux";
const state = useSelector(state => state)