React-Router: как перезагрузить страницы второго уровня и ниже - PullRequest
0 голосов
/ 03 мая 2019

Я сейчас разрабатываю веб-сайт с этими маршрутами:

/liga-femenina-1
/liga-femenina-1/equipos
/liga-femenina-1/resultados
/liga-femenina-1/estadisticas
/liga-femenina-1/buscador
/liga-femenina-2
/liga-femenina-2/equipos
/liga-femenina-2/resultados
/liga-femenina-2/estadisticas
/liga-femenina-2/buscador

Я могу получить доступ ко всем из них и перемещаться без проблем.Но когда я пытаюсь перезагрузить страницу, я могу правильно перезагрузить страницы только с URL-адресами только с одним каталогом.Я могу перезагрузить страницы как:

/liga-femenina-1
/liga-femenina-2

Но, когда я пытаюсь перезагрузить страницы с URL-адресами с более чем одним каталогом, как эти:

/liga-femenina-1/equipos
/liga-femenina-1/resultados
/liga-femenina-1/estadisticas
/liga-femenina-1/buscador
/liga-femenina-2/equipos
/liga-femenina-2/resultados
/liga-femenina-2/estadisticas
/liga-femenina-2/buscador

Страница не отображается и отображаетсяв пустом виде.

Код такой:

import {BrowserRouter as Router, Route, NavLink} from "react-router-dom";
<Router>
    <Tab.Container>
        <Row>
            <div className = "fondo-submenu">
                <Col md = {12}>
                    <Nav justify variant="pills">
                        <Nav.Item>
                            <NavLink 
                                className = "btn submenu btn-lg btn-block" 
                                activeClassName = "btn submenu-active btn-lg btn-block"
                                exact
                                to = "/liga-femenina-1">
                                    Home
                            </NavLink>
                        </Nav.Item>
                        <Nav.Item>
                            <NavLink 
                                className = "btn submenu btn-lg btn-block" 
                                activeClassName = "btn submenu-active btn-lg btn-block"
                                to = "/liga-femenina-1/equipos">
                                    Equipos
                            </NavLink>
                        </Nav.Item>
                        <Nav.Item>
                            <NavLink 
                                className = "btn submenu btn-lg btn-block" 
                                activeClassName = "btn submenu-active btn-lg btn-block"
                                to = "/liga-femenina-1/resultados">
                                    Resultados
                            </NavLink>
                        </Nav.Item>
                        <Nav.Item>
                            <NavLink 
                                className = "btn submenu btn-lg btn-block" 
                                activeClassName = "btn submenu-active btn-lg btn-block"
                                to = "/liga-femenina-1/estadisticas">
                                    Estadísticas
                            </NavLink>
                        </Nav.Item>
                        <Nav.Item>
                            <NavLink 
                                className = "btn submenu btn-lg btn-block" 
                                activeClassName = "btn submenu-active btn-lg btn-block"
                                to = "/liga-femenina-1/buscador">
                                    Buscador
                            </NavLink>
                        </Nav.Item>
                    </Nav>
                </Col>
            </div>
        </Row>
        <Row>
            <Col md = {12}>
                <Tab.Content>                              
                    <Route exact path = "/liga-femenina-1" component = {HomeLF1Content} />
                    <Route path = "/liga-femenina-1/equipos" component = {TeamsLF1Content} />                                
                    <Route path = "/liga-femenina-1/resultados" component = {ResultsLF1Content} />                                
                    <Route path = "/liga-femenina-1/estadisticas" component = {StatsLF1Content} />                                
                    <Route path = "/liga-femenina-1/buscador" component = {SearchLF1Content} />
                </Tab.Content>            
            </Col>
        </Row>                            
    </Tab.Container>                        
</Router>

В бэкэнде я использую NodeJS, поэтому, если я проверяю URL, который запрашивается при перезагрузке, и URL имеет только один каталог, У меня есть это:

enter image description here

Но, если я попытаюсь перезагрузить страницу с URL-адресом, который имеет более одного каталога, как / liga-femenina-1 / equipos, например, у меня есть это:

enter image description here

Как вы можете видеть, у меня ошибка при попытке получитьфайл bundle.js.

GET /liga-femenina-1/assets/js/bundle.js 404 1.660 ms - 174

Это связано с тем, что файл bundle.js находится в / assets / js / bundle.js .Здесь вы можете увидеть, как в иерархии каталогов находится файл bundle.js:

enter image description here

Итак, как я могу получить доступ к * 1041?* / assets / js / bundle.js при перезагрузке страниц с более чем одним каталогом, например / liga-femenina-1 / equipos .

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