Пустая страница React router

Я использую в своем проекте библиотеку response-router-dom "^ 4.3.1", и у меня есть страница входа и страницы администратора. После входа в систему я хочу перенаправить домашнюю страницу на страницы администратора (history.push ('/ home');), но браузер отображает пустую страницу. Как я могу решить эту проблему?

мой основной роутер.

 <Router history = {history}>
       <Switch>
             <Route path = "/register" name = "Register Page" component = {Register}/>
             <Route path = "/404" name = "Page 404" component = {Page404}/>
             <Route path = "/500" name = "Page 500" component = {Page500}/>
             <Route path = "/home" name = "Home" component = {Full}/>
             <Route path = "/" name = "Login" component = {Login}/>
        </Switch>
  </Router>

Полное содержание компонента:

  <div className = "app">
                    <Header/>
                    <div className = "app-body">
                        <Sidebar {...this.props}/>
                        <main className = "main">
                            <Breadcrumb/>
                            <Container fluid>
                                <Switch>
                                    <Route path = "/dashboard" name = "Dashboard" component = {Dashboard}/>
                                    <Route path = "/applications" name = "Applications" component = {Applications}/>
                                    <Route path = "/roles" name = "Roles" component = {Roles}/>
                                    <Route path = "/poc" name = "poc" component = {Poc}/>
                                    <Redirect from = "/home" to = "/dashboard"/>
                                </Switch>
                            </Container>
                        </main>
                        <Aside/>
                    </div>
                    <Footer/>
                </div>

Вы можете помочь мне?

вы пробовали this.props.history.push ('/ home')?

— 03.09.2018 11:05

добавьте код своей домашней страницы

— 03.09.2018 14:15

я добавил комментарий для компонента домашней страницы

— 04.09.2018 09:24

reactjs react-router

03.09.2018 10:55

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Массив зависимостей в React

Все о массиве Dependency и его связи с useEffect.

Компонент против элемента в ReactJS - секрет оптимизации производительности за счет повторного использования элементов

Проще говоря, компонент - это фабрика для создания элементов.

Руководство по использованию хука useEffect для методов жизненного цикла React

191

Ответы 1

я пробую this.props.history.push ('/ home'); часть кода, но работает некорректно.

Вы можете увидеть мои коды компонентов ниже. мой полный код компонента:

class Full extends Component {
    render() {
        return (
            <div className = "app">
                <Header/>
                <div className = "app-body">
                    <Sidebar {...this.props}/>
                    <main className = "main">
                        <Breadcrumb/>
                        <Container fluid>
                            <Switch>
                                <Route path = "/dashboard" name = "Dashboard" component = {Dashboard}/>
                                <Route path = "/applications" name = "Applications" component = {Applications}/>
                                <Route path = "/roles" name = "Roles" component = {Roles}/>
                                <Route path = "/poc" name = "poc" component = {Poc}/>
                                <Redirect from = "/home" to = "/dashboard"/>
                            </Switch>
                        </Container>
                    </main>
                    <Aside/>
                </div>
                <Footer/>
            </div>
        );
    }
}
Dashboard component code :

class Dashboard extends Component {
  constructor(props) {
    super(props);
  }
  render() {

    return (
      <div className = "animated fadeIn">
        <div>test</div>
      </div>
    )
  }
}

export default Dashboard;

Исторический код:

import {createBrowserHistory} from 'history';
export const history = createBrowserHistory();

03.09.2018 15:43

Другие вопросы по теме

Создайте субдомен, как это делает Slack, например. : https://someteam.slack.com/ в REACT JS

Ошибка функции карты: не удается прочитать свойство 'карта' undefined в Reactjs

Response-router не работает, когда я обновляю браузер

React - Как вернуться на предыдущую страницу пагинации?

Перенаправление с согласованными параметрами с помощью response-router-dom не работает

Установка реактивного маршрутизатора без обновления файла package.json

Компонент не отображается в многоэтапной форме React Router

Совместное использование опор маршрутизатора для компонентов, которые не заключены в маршрутизатор

Как перечислить с помощью циклов в React Native

Как вернуть значение из функции в React Native

Пустая страница React router

Ответы 1

Другие вопросы по теме

Похожие вопросы