【问题标题】:Not getting props of Components in react-router没有在反应路由器中获得组件的道具
【发布时间】:2018-12-19 04:53:28
【问题描述】:

我想使用 React 组件来获取 id 匹配,但是在转到 url 时会出错:http://localhost:8080/portfolio/1 并且对于其他 url 运行良好。错误:

GET http://localhost:8080/portfolio/bundle.js 404 (Not Found)      1:1  
Refused to execute script from 'http://localhost:8080/portfolio/bundle.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

AppRouter.js

  import React from 'react';
  import { BrowserRouter, Route, Switch, Link,NavLink } from 'react-router-dom';
  import Home from '../Components/Home';
  import Contact from '../Components/Contact';
  import PortfolioItemPage from '../Components/PortfolioItemPage.js'; 
  import NotFound from '../Components/NotFound.js';
  import Header from '../Components/Header';


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

     <Header/>
     <Switch>
         <Route path="/" component={Home} exact={true} />
         <Route path="/portfolio/:id" component={PortfolioItemPage} />

         <Route path="/contact" component={Contact}/>
         <Route component={NotFound} />
     </Switch>
   </div>
 </BrowserRouter>
);

  export default AppRouter;

PortfolioItemPage.js

  import React from 'react';
  const PortfolioItemPage = (props) => {
  console.log(props);
    return (
   <div>
     <h1>Hii there...</h1>
    </div>
   );
   };
     export default PortfolioItemPage;

要怎么做才能在我转到http://localhost:8080/portfolio/1 时不会出错?

【问题讨论】:

    标签: react-router react-router-v4 react-router-component


    【解决方案1】:

    您的应用似乎试图从相对路径 http://localhost:8080/portfolio/ 加载 bundle.js

    尝试将&lt;base href="/" /&gt; 添加到&lt;html&gt;&lt;head&gt; 以强制您的应用从根URL 加载资产。

    【讨论】:

      猜你喜欢
      • 2019-08-15
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-09-01
      • 1970-01-01
      • 2018-06-09
      • 2019-01-30
      相关资源
      最近更新 更多