Question

我似乎做对了所有事情，但是我遇到了这个strict MIME type和404错误，但我不知道为什么会这样。我是React和Routing的新手，我真的被困在这里。

import React from "react";
import { BrowserRouter, Route, Switch } from "react-router-dom";
import Home from "../components/Home";
import Contact from "../components/Contact";
import Portfolio from "../components/Portfolio";
import NotFound from "../components/NotFound";
import Header from "../components/Header";
import Portfoliopage from "../components/PortfolioPage";

const AppRouters = () => (
  <BrowserRouter>
    <div>
      <Header />
      <Switch>
        <Route path="/" component={Home} exact={true} />
        <Route path="/contact" component={Contact} />
        //*I tried using this component directly with the /:id here...*
        <Route path="/portfolio/:id" component={Portfolio} />
        *//I also tried this nested routing here*
        <Route path="/portfolio" component={Portfolio}>
          <Route path="/:id" component={Portfoliopage} />
        </Route>
        <Route component={NotFound} />
      </Switch>
    </div>
  </BrowserRouter>
);

This is the error that I get when I run the code

Answer 1

您的错误表明您的bundle.js是相对于当前URL加载的。将/添加到src的开头以使其绝对。

<script src="/bundle.js"></script>

使用index /：id反应路由器的url属性

1 个答案: