对路由的理解
在pc端页面之间的切换,我们大多使用a链接、location等操作。
在react.js开发中,我们采用组件化操作,一个页面就是一个组件。所以页面和页面之间的跳转就相当于是组件和组件之间的跳转。
我们知道react.js是一种单页面项目开发,就是在一个主页面的基础上存放各种子页面。这就好像一根网线连接路由器,而路由器能分出很多根网线连接大量的电脑。所以我们将单页面项目的页面跳转称为路由。
在第一篇放出的框架中,我们介绍过专门用来管理路由的文件——routes.js文件。
1、使用Link进行路由跳转
(1)routes.js中的配置
import React from 'react'
import { Route, IndexRoute } from 'react-router'
import MyScreen from './containers/MyScreen';
import {
App,
Home,
} from './containers'
export default (
<Route path="/" component={App}>
<IndexRoute component={Home}/>
<Route path="my">
<IndexRoute component={MyScreen}/>
</Route>
</Route>
);