反應redux狀態未定義

Question

我是redux的新手，對兩者都做出了反應。 我正在嘗試我的第一個redux應用，其中我的狀態以未定義狀態通過。 盡管我在互聯網上搜索以找出問題所在，但無法找出問題所在。

以下是代碼段-

Init.js

export default function() {
   return {
     isLoggedIn: false,
     username: "admin"
  };
}

Reducer.js

import initialState from "./init";
let currentState = initialState;
export default function(state = currentState, action) {
  if (action.type === "ONLICK") {
    return state;
  } else {
    return state;
  }
}

Index.js

const allReducers = combineReducers({
  currentstate: currentState
});

export default allReducers;

currentState.js

import React, { Component } from "react";
import { bindActionCreators } from "redux";
import { connect } from "react-redux";
import { allreducers } from "./../reducer/index";

class CurrentState extends Component {
  render() {
    console.log("Logged In-" + this.props.isLoggedIn);
    return <div>{this.props.isLoggedIn}</div>;
  }
}

function mapStateToProps(state) {
  return {
    isLoggedIn: state.isLoggedIn
  };
}

export default connect(mapStateToProps)(CurrentState);

navbar.js

import React, { Component } from "react";
import CurrentState from "./../container/currentstate";
import "bootstrap/dist/css/bootstrap.css";

class Navbar extends Component {
  constructor() {
    super();
  }
  render() {
    return (
      <div>
        <h3>State -</h3>
        <CurrentState />
      </div>
    );
  }
}

Navbar.js是顯示狀態屬性之一的地方。 但是在控制台中，當我嘗試打印該值時，它將顯示為未定義。

Answer 1

您在mapStateToProps中以錯誤的方式獲取狀態

采用

function mapStateToProps(state) {
  return {
    isLoggedIn: state.currentstate
  };
}

代替

function mapStateToProps(state) {
      return {
        isLoggedIn: state.isLoggedIn
      };
}

希望如此會有所幫助