反应路由器参数和查询不起作用

时间:2017-12-28 19:58:53

标签: javascript reactjs react-router react-redux

从最近几天开始,我找到了解决这个问题的方法。这里发生的事情是我想要动态链接。你可以在这里看到:

<Route path="/edit/:username" component={EditExpensePage} />

但是当我转到/edit/12时,我收到了这个错误:

  

获取http://127.0.0.1:8080/edit/bundle.js net :: ERR_ABORTED

这是我的代码:

import React from 'react';
import { BrowserRouter, Route, Switch, Link, NavLink } from 'react-router-dom';
import ExpenseDashboardPage from '../components/ExpenseDashboardPage';
import AddExpensePage from '../components/AddExpensePage';
import EditExpensePage from '../components/EditExpensePage';
import HelpPage from '../components/HelpPage';
import NotFoundPage from '../components/NotFoundPage';
import Header from '../components/Header';

const AppRouter = () => (
  <BrowserRouter>
    <div>
      <Header />

        <Route path="/" component={ExpenseDashboardPage} exact={true} />
        <Route path="/create" component={AddExpensePage} />
        <Route path="/edit/:username" component={EditExpensePage} />
        <Route path="/help" component={HelpPage} />

    </div>
  </BrowserRouter>
);

export default AppRouter;

1 个答案:

答案 0 :(得分:0)

您似乎正在使用相对网址加载bundle.js文件。

因此,当您加载页面http://127.0.0.1/Home(或其他)时,它会解析为http://127.0.0.1/bundle.js,这是正确的。

但是,当您加载页面http://127.0.0.1/edit/12时,它会解析为http://127.0.0.1/edit/bundle.js,这是不正确的。

使<script代码使用绝对网址。