Reactjs 正在更新react app.js文件身份验证中的redux状态 import React，{Component}来自“React”； 从“react router dom”导入{BrowserRouter，Route，Switch，Redirect}； 从“@fortawesome/fontawesome svg核心”导入{library}； 进口{ 法霍姆， 法洛克， 胖子， faStickyNote， 传真机 }来自“@fortwome/free solid svg icons”； 从“react redux”导入{connect}； 从“/store”导入存储； 从“/actions/authActions”导入{loadUser}； 从“/Home”导入主页； 从“/Components/SideNav”导入SideNav； 从“/Components/Recent”导入最近版本； 从“/Components/TopBar”导入TopBar； 从“/AddNote”导入AddNote； 从“/Components/LogIn/LogIn.js”导入登录名； 从“/Components/Register/Register”导入寄存器； 从“/Components/ToDo/ToDo”导入ToDo； 从“crypto”导入{timingSafeEqual}； 库。添加（faHome、faClock、faTasks、faStickyNote、faCalendarWeek）； 类应用程序扩展组件{ componentDidMount（）{ store.dispatch（loadUser（））； } componentDidUpdate（prevProps）{ if（this.props！=this.prevProps）{ log（“你好”） } } 登录容器=（）=>{ 返回； }; RegisterContainer=（）=>{ 返回； }; DefaultContainer=（）=>{ 返回( ); }; //检查身份验证 AuthRoute=（{component:component，props，…rest}）=>{ 返回( { if（this.props.auth.isAuthenticated）{ 返回； } 否则{ 返回( ); } }} /> ); }; render（）{ 返回( ); } } 常量mapStateToProps=（状态）=>({ auth:state.auth }) 导出默认连接（MapStateTops）（应用程序）；

app.js登录后如何从redux接收新状态？它将获得的初始获取isAuthenticated=false。用户然后登录，但app.js没有获得新状态。我实现AuthenitAction是否错误？当尝试更新道具时，ComontDidUpdate抛出了一个错误，但感觉这是一种糟糕的方式，不管怎样

您似乎没有mapDispatchToProps。您需要通过分派操作来更改状态。@dorriz好的，我在哪里调用函数分派类型？抱歉，我不清楚。您应该添加mapDispatchToProps并使用this.props.dispatch来分派操作。无论您的登录成功代码在哪里运行，都会从那里发送操作。我看不出您在哪里这样做，但登录成功后，您将调度一个操作来更新您所在状态下的isAuthenticated。@dorriz我在另一个文件中有一个函数，用于查看是否存在auth cookie并调度该类型。在app.js文件中，它将映射stateToprops，当console.logged第一个状态是初始状态，然后是更新状态为isAuth=true的另外两个console.logs；

import React, { Component } from "react";
import { BrowserRouter, Route, Switch, Redirect } from "react-router-dom";
import { library } from "@fortawesome/fontawesome-svg-core";
import {
  faHome,
  faClock,
  faTasks,
  faStickyNote,
  faCalendarWeek
} from "@fortawesome/free-solid-svg-icons";

import { connect } from "react-redux";
import store from "./store";
import { loadUser } from "./actions/authActions";

import Home from "./Home";
import SideNav from "./Components/SideNav";
import Recent from "./Components/Recent";
import TopBar from "./Components/TopBar";
import AddNote from "./AddNote";
import LogIn from "./Components/LogIn/LogIn.js";
import Register from "./Components/Register/Register";
import ToDo from "./Components/ToDo/ToDo";
import { timingSafeEqual } from "crypto";

library.add(faHome, faClock, faTasks, faStickyNote, faCalendarWeek);

class App extends Component {
  componentDidMount() {
    store.dispatch(loadUser());
  }

  componentDidUpdate(prevProps) {
    if(this.props != this.prevProps) {
      console.log("hello")
    }

  }

  LogInContainer = () => {
    return <Route path="/login" component={LogIn} />;
  };

  RegisterContainer = () => {
    return <Route path="/register" component={Register} />;
  };

  DefaultContainer = () => {
    return (
      <div className="app_container">
        <SideNav />
        <TopBar />
        <Route exact path="/" component={Home} />
        <Route path="/recent" component={Recent} />
        <Route path="/AddNote" component={AddNote} />
        <Route path="/ToDo" component={ToDo} />
      </div>
    );
  };

  // Check for authenticaition

  AuthRoute = ({ component: Component, props, ...rest }) => {
    return (
      <Route
        {...rest}
        render={props => {
          if (this.props.auth.isAuthenticated) {
            return <Component {...props} />;
          } 
          else {
            return (
              <Redirect
                to={{
                  pathname: "/login",
                  state: { from: this.props.location }
                }}
              />
            );
          }
        }}
      />
    );
  };

  render() {
    return (
      <BrowserRouter>
        <Switch>
          <Route exact path="/login" component={this.LogInContainer} />
          <Route exact path="/register" component={this.RegisterContainer} />
          <this.AuthRoute component={this.DefaultContainer} />
        </Switch>
      </BrowserRouter>
    );
  }
}

const mapStateToProps = (state) => ({
  auth: state.auth
})

export default connect(mapStateToProps)(App);