Панель навигации не отображается, когда я запускаю запуск пряжи (т. Е. Сборку пряжи и сервер пряжи), но она отображается в dev (узел server.js / узел client.js) - PullRequest
0 голосов
/ 18 марта 2019

Панель навигации не отображается, несмотря на работу на сервере разработки.Я проверил инструмент, чтобы увидеть, отображается ли панель навигации на странице входа в систему и есть ли она на серверах разработки и сборки.Я понятия не имею, почему это не работает.Я использую сырые CSS для создания этих панелей навигации, я использовал className для их идентификации.Мы ценим любую помощь1013 *

ГЛАВНАЯ

import React, { Component } from 'react';
import axios from 'axios';
import { Route } from 'react-router-dom';

import Signup from './components/sign-up';
import LoginForm from './components/login-form';
import Navbar from './components/navbar';
import Home from './components/home';


import concordiaLogo from './assets/concordia-logo.jpeg';


class App extends Component {
  constructor() {
    super();
    // Must set state to null otherwise UI will load prematurely before server response
    this.state = null;

    this.getUser = this.getUser.bind(this);
    this.componentDidMount = this.componentDidMount.bind(this);
    this.updateUser = this.updateUser.bind(this);
  }

  componentDidMount() {
    this.getUser();
  }

  getUser() {
    axios.get('/user').then((response) => {
      console.log('Get user response: ');
      console.log(response.data);
      if (response.data.user) {
        console.log('Get User: There is a user saved in the server session: ');

        this.setState({
          loggedIn: true,
          username: response.data.user.username,
        });
      } else {
        console.log('Get user: no user');
        this.setState({
          loggedIn: false,
          username: null,
        });
      }

      console.log('SHOULD RELOAD PAGE HERE');
    }).catch((error) => {
      console.log('Get user: no user');
      console.error(error);
      this.setState({
        loggedIn: false,
        username: null,
      });
    });
  }

  updateUser(userObject) {
    this.setState(userObject);
  }

  render() {
    const { state, updateUser, signup } = this;

    if (!this.state) {
      // Show nothing while waiting for axios response
      return <div />;
    }
    return (

      <div className='App'>
        <Navbar updateUser={updateUser} loggedIn={state.loggedIn} />
        {/* greet user if logged in: */}
        {state.loggedIn
          && (

            <Home />

          )
        }



        {}
        {/* Routes to different components */}
        {!state.loggedIn && (
          <Route
            exact
            path='/'
            render={() => (
              <LoginForm
                updateUser={updateUser}
              />
            )}
          />
        )
        }
        {!state.loggedIn && (
          <Route
            path='/signup'
            render={() => (
              <Signup
                signup={signup}
              />
            )}
          />
        )}


        <div className='home-bottom'>
          <img src={concordiaLogo} alt='Concordia University' />
        </div>
      </div>
    );
  }
}

export default App;
...