首页 > 解决方案 > React Redux 路由问题

问题描述

我最近在使用我的 react 路由器和 redux 时遇到了一些问题。基本上,我有一个 redux 值集,让我知道是否选择了一个项目。如果该项目被选中,那么它将允许使用 URL。我注意到的一件事。如果我添加重定向功能。它打破了一切

认证功能:

import React, { Component, Fragment } from "react";
import { Provider } from "react-redux";
// import store from "./store";
import {
  BrowserRouter as Router,
  Switch,
  Route,
  Redirect
} from "react-router-dom";
import { connect } from "react-redux";
import Profile from "./Profile";
import AddDomain from "./AddDomain";
import ChoosePackage from "./ChoosePackage";
import DashboardHome from "./DashboardHome";
import { Elements } from "@stripe/react-stripe-js";
import PropTypes from "prop-types";
import { loadStripe } from "@stripe/stripe-js";
const stripePromise = loadStripe("pk_test_7S0QSNizCdsJdm9yYEoRKSul00z4Pl6qK6");
class index extends Component {
  componentDidMount() {
    console.log("DOMAIN NAME" + this.props.domain_name);
  }
  state = {
    domain_name: ""
  };
  static propTypes = {
    domain_name: PropTypes.string.isRequired
  };
  domainCheck = () => {
    if (this.props.domain_name != "") {
      return <ChoosePackage />;
    } else {
      console.log("running rediect");
      return <Redirect to="/dashboard" />;
    }
  };
  render() {
    return (
      <React.Fragment>
        <Route path="/dashboard/add-domain/choose-package">
          {this.domainCheck()}
        </Route>
        <Route exact path="/dashboard/add-domain">
          <AddDomain />
        </Route>
        <Route exact path="/dashboard/profile">
          <Profile />
        </Route>
        <Route exact path="/dashboard">
          <DashboardHome />
        </Route>
      </React.Fragment>
    );
  }
}

const mapStateToProps = state => ({
  domain_name: state.domain.domain_name
});
index.defaultProps = {
  domain_name: ""
};
export default connect(mapStateToProps, { pure: false })(index);

任何帮助是极大的赞赏

标签: javascriptreactjsredux

解决方案


推荐阅读