Reactjs 当我尝试访问redux状态时，它返回undefined

我可以发送我的状态，但在redux中访问时遇到问题

import React, {useEffect} from 'react';
import AuthenticationPage from './AuthenticationPage';
import '../styles/App.css';
import SignOut from './SignOut';
import{TOGGLE_LOGIN} from "../redux/actionTypes"
import{connect} from 'react-redux'

function App(props) {

  useEffect(()=>{
    if(window.localStorage.getItem('IsUserLogged')==="true"){
      props.toggleLogin();
    }
    console.log(props.isLogged);    //console show undefined  
  },[])

  return (
    <div className="App">
      {props.isLogged===true?
      <SignOut/>:
      <AuthenticationPage/>}
    </div>
  );
}

const mapStateToProps = state =>{
  return{
    isLogged: state.isLogged
  }
}

const mapDispatchToProps = dispatch=>{
  return{
    toggleLogin: ()=>dispatch({type: TOGGLE_LOGIN})
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(App);

减速机/index.js

actions.js

actionTypes.js

store.js

---

这是因为在您的

combineReducer

中有一个

LogInReducer

键

因此，状态实际上是

LogInReducer.isLogged

（这也可以在redux开发工具屏幕截图中看到）

您可能需要执行以下操作：

const mapStateToProps = state => {
  const { isLogged } = state.LogInReducer;

  return {
    isLogged
  };
}

---

这是因为在您的

combineReducer

中有一个

LogInReducer

键

因此，状态实际上是

LogInReducer.isLogged

（这也可以在redux开发工具屏幕截图中看到）

您可能需要执行以下操作：

const mapStateToProps = state => {
  const { isLogged } = state.LogInReducer;

  return {
    isLogged
  };
}

---

创建一个单独的

useffect

hook来记录

isLogged

状态的值后会发生什么？像

useffect（（）=>{console.log（props.isLogged）；}[props.isLogged]）

+1：还有一条评论，我想

useDispatch

和

useSelector

可能比

mapDispatchToProps

和

MapStateTrops

更适合功能组件。如果您对其中的一个工作示例感兴趣，请查看我的一个存储库：@norbitrial，通过使用

useDispatch

，您使FC了解Redux，这可能不是您在所有情况下都想要的。注意

connect（）

是一个HOC。Joseph answer帮助了我，它现在可以工作了，谢谢你的推荐，我会检查它的！创建一个单独的

useffect

hook来记录

isLogged

状态的值后会发生什么？像

useffect（（）=>{console.log（props.isLogged）；}[props.isLogged]）

+1：还有一条评论，我想

useDispatch

和

useSelector

可能比

mapDispatchToProps

和

MapStateTrops

更适合功能组件。如果您对其中的一个工作示例感兴趣，请查看我的一个存储库：@norbitrial，通过使用

useDispatch

，您使FC了解Redux，这可能不是您在所有情况下都想要的。注意

connect（）

是一个HOC。Joseph answer帮助了我，它现在可以工作了，谢谢你的推荐，我会检查它的！

import{TOGGLE_LOGIN} from "./actionTypes"

export const ToggleLogin=()=>({
        type: TOGGLE_LOGIN
});

export const TOGGLE_LOGIN="TOGGLE_LOGIN";
});

import {createStore} from 'redux';
import rootReducer from './reducers';

export default createStore(rootReducer, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__());

const mapStateToProps = state => {
  const { isLogged } = state.LogInReducer;

  return {
    isLogged
  };
}