在firebase上托管时,反应深层/嵌套路由器无法正常工作

时间:2016-12-01 10:43:15

标签: reactjs firebase webpack react-router firebase-hosting

我检查过与此问题相关的stackoverflow,但没有解决它。

我正在为reactJS应用程序使用嵌套路由,该应用程序在我的本地webpack服务器上运行良好,但不在firebase主机上工作。奇怪的是它一直有效/admin/dashboard路由,但任何其他路由都不起作用,即/admin/list-bayaans/admin/listBayaans它在浏览器控制台中显示错误[找不到匹配的路径]。< / p>

Routes.js:

import React from 'react';
import {Route, IndexRoute, Link} from 'react-router';

import Layout from './components/layout';
import Homepage from './components/homepage';
import Bayaans from './components/bayaanspage';
import Readquran from './components/readquran';
import Duas from './components/duaspage';
import Events from './components/eventspage';
import Contactpage from './components/contact';

import AdminLayout from './components/admin/adminLayout';   // admin section (using same theme with little style variation)
import LoginPg from './components/admin/loginPage';
import Dashboard from './components/admin/dashboard';
import AdminBayaansPg from './components/admin/adminBayaansPage';
import AdminDuasPg from './components/admin/adminDuasPage';
import AdminEventsPg from './components/admin/adminEventsPage';

// we are defining 'home' route explicitly as an patch for now. So if user is on any innner page and he clicks the HOME menu then '/home' will render as '/' does not work and does nto return to the index page. Need to see it though.

export default (
            <div>
                 <Route path="/" component={Layout} >
                    <IndexRoute component={Homepage} />
                    <Route path="home" component={Homepage} />
                    <Route path="bayaans" component={Bayaans} />
                    <Route path="read-quran" component={Readquran} />
                    <Route path="duas" component={Duas} />
                    <Route path="events" component={Events} />
                    <Route path="contact" component={Contactpage} />
                 </Route>

                 <Route path="/admin" component={AdminLayout} >
                    <IndexRoute component={LoginPg} />
                    <Route path="dashboard" component={Dashboard} />
                    <Route path="list-bayaans" component={AdminBayaansPg} />
                    <Route path="list-duas" component={AdminDuasPg} />
                    <Route path="list-events" component={AdminEventsPg} />
                 </Route>
             </div>
);

问题:2 当我尝试使用firebase deploy命令更改路由时再次在firebase上部署,当我在浏览器中检查路由时保持相同。 (是的,我正在重新部署我的代码然后进行部署。另外,我只是在一条路线中进行小的文本更改,只是为了调试,正如我在问题的开头所提到的那样。即/list-bayaans vs {{1} }

注意:我也检查了此链接,但它不相关且已经包含此链接中提到的内容:Trouble with deep routes on a single-page app on Firebase hosting

1 个答案:

答案 0 :(得分:0)

现在正在运作。基本上firebase需要花费几分钟来加载新的部署更改(有时)。在我的情况下花了大约15分钟。

相关问题