反應路由器參數和查詢不起作用

Question

從最近幾天我找到了解決這個問題的方法。這里發生的事情是我想要動態鏈接。你可以在這里看到：

<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;

Answer 1

看起來您正在使用相對URL加載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標簽使用絕對URL。