Тернар не оценивает должным образом - PullRequest
0 голосов
/ 23 октября 2019

Я делаю компонент navbar, который должен отображать один набор ссылок, если пользователь аутентифицирован, и другой, если пользователь не аутентифицирован. Показанные ссылки не меняются в зависимости от значения состояния. Как я могу решить эту проблему?

Попытался переключить состояние моего редуктора, и, кажется, ничто не влияет на ссылки.

import React, { Fragment } from "react";
import { Link } from "react-router-dom";
import { connect } from "react-redux";
import PropTypes from "prop-types";
import { logout } from "../../actions/auth";

const Navbar = ({ auth: isAuthenticated, loading }, logout) => {
  const guestLinks = (
    <ul>
      <li>
        <Link to="/landing">
          <i className="fas fa-car" /> Ruber
        </Link>
      </li>
      <li>
        <Link to="/register">
          <i className="fas fa-pen" /> Register
        </Link>
      </li>
      <li>
        <Link to="/login">
          <i className="fas fa-sign-in-alt" /> Login
        </Link>
      </li>
    </ul>
  );

  const authLinks = (
    <ul>
      <li>
        <i className="fas fa-home" />
        <Link to="/home"> Home</Link>
      </li>
      <li>
        <i className="fas fa-history" />
        <Link to="/rides"> Past Rides</Link>
      </li>
      <li>
        <i className="fas fa-route" />
        <Link to="/create"> Request ride</Link>
      </li>
      <li>
        <i className="fas fa-user" />
        <Link to="/user"> User Info</Link>
      </li>
      <li>
        <i className="fas fa-sign-out-alt" />
        <Link to="/landing"> Log Out </Link>
      </li>
    </ul>
  );

  return (
    <nav>
      {!loading && (
        <Fragment>{isAuthenticated ? authLinks : guestLinks}</Fragment>
      )}
    </nav>
  );
};

Navbar.propTypes = {
  logout: PropTypes.func.isRequired,
  auth: PropTypes.object.isRequired
};

   const mapStateToProps = state => ({
      auth: state.auth
    });
    export default connect(
      mapStateToProps,
      { logout }
     )(Navbar);

Навбар должен переключаться назад и вперед между guestLinks и authLinks

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...