React Router V4不起作用

时间:2019-09-20 10:20:27

标签: reactjs react-router

自3天以来,我一直在进行反应路线工作,但无法正常工作。     我不知道我在哪里做错了,即使简单的路由也不起作用...如果简单的路由(没有参数)起作用,那么我想将ID传递给新组件。     但是我可以选择性地传递ID ..如果我删除了?然后路由不起作用..我也尝试过使用switch,而且也是。.

And One More issue is by passing ID optionally i am getting Undefined in New Component Page During render (First time)..So i wanted to pass ID:1 from router .Please help me out...Thanks

    <Route name="ideas" path="/Hello" component={New} />  (Not Working)
<Route name="ideas" path="/:Hello" component={New} /> (Not working)
   <Route name="ideas" path="/New/:Hello?" component={New} />(Not working)
    <Route name="ideas" path="/" component={New} /> {Working}
    <Route name="ideas" path="/:Hello?" component={New} /> (working)

import React from 'react';
import ReactDOM from'react-dom'
import New from './New'
import Demo from "./demo";
import {
    BrowserRouter as Router,
    Route,
    Switch,

} from 'react-router-dom'

function App() {
    return (
<div>
    <Router>
        <Route name="ideas" path="/Hello" component={New} />
    </Router>
</div>

);
}
ReactDOM.render(
    <App />,
    document.getElementById("root")
);

export default App;

1 个答案:

答案 0 :(得分:0)

我更新了您的密码和邮箱。您没有使用Switch中的react-router-dom。处理机智路线时这是必需的。请选中更新的代码和框。

按以下方式使用

import React from "react";
import ReactDOM from "react-dom";
import New from "./New";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";

function App() {
  return (
    <div>
      <Router>
        <Switch>
          <Route name="ideas" path="/Hello" component={New} />
        </Switch>
      </Router>
    </div>
  );
}
ReactDOM.render(<App />, document.getElementById("root"));

您还可以查看https://codesandbox.io/s/smoosh-currying-8job8

您的代码的更新版本:

https://codesandbox.io/s/unruffled-hellman-2f19h