<Route component={ComList} path='/list'></Route>无法访问

Question

router.js文件内容如下（该文件路径src/router.js）：

import React from 'react';

import ReactDom from 'react-dom';

import { BrowserRouter, Route } from 'react-router-dom';

import Index from './index';

import ComList from './components/list';

export default class Root extends React.Component {

render() {

console.log(Index);

return (

<BrowserRouter >

<div>

<Route component={Index} path='/'></Route>

<Route component={ComList} path='/list'></Route>

</div>

</BrowserRouter>

);

}

}

ReactDom.render(

<Root />,

document.getElementById('example')

);

Answer 1

Parry 2017-12-07 19:51:48

添加 exact 参数。
<Route exact component={Index} path='/'></Route>

• 提问者 慕无忌0079048 #1

  加上这个参数之后还是不能访问，加完之后路由为：
                      <Route exact component={Index} path='/'></Route>
                      <Route exact component={ComList} path='/list'></Route>

• Parry 回复 提问者 慕无忌0079048 #2

  第二个不要加，或者你直接看我源码的定义。

• 提问者 慕无忌0079048 回复 Parry #3

  这样也是不行的，<Route exact component={Index} path='/'></Route>
                      <Route component={ComList} path='/list'></Route>
  
  这个版本和您课上用的有点区别
  "react-router": "^4.2.0",
      "react-router-dom": "^4.2.2",

Answer 2

Parry 2017-12-07 16:50:03

你 list 的路由定义在哪里？

• 提问者 慕无忌0079048 #1

  路由定义已经贴在上面了
  
  问题重新描述一下：path不是跟目录'/'则无法访问，详细描述如下：
  
  如果路由定义为：
  <Route component={Index} path='/'></Route>
  <Route component={ComList} path='/list'></Route>
  则{ComList}访问不了，而{Index}可以访问
  
  
  如果路由定义为：
  <Route component={Index} path='/list'></Route>
  <Route component={ComList} path='/'></Route>
  则{ComList}可以访问，而{Index}访问不了