React-Router
白小宇
学识的基础是创造的基础。
展开
-
React-Router实战:基本路由、路由传参、嵌套路由
安装> npm install -g create-react-app> create-react-app demo-app> cd demo-app> npm install react-router-dom一、基本路由(Dome1)1、目录及 组件关系图目录结构:组件关系:2、源码./index.jsimport React原创 2019-03-17 17:53:27 · 4704 阅读 · 2 评论 -
React-Router实战:NavLink
基础:(1)引入使用:import { NavLink } from 'react-router-dom'<NavLink to="/about"> About </NavLink>(2)activeClassName:string//当被激活时,显示类名为selected 的css样式<NavLink to="/about" activ...原创 2019-03-23 17:09:41 · 6541 阅读 · 0 评论 -
React-Router实战:路由传参(正则表达式)
首先我们先做个路由普通传参的例子。一、准备工作1、目录结构| - index.js| - components | - App => App.js | - Home => Home.js | - About => About.js | - News => News.js2、源码./index.jsi...原创 2019-03-23 18:23:30 · 5754 阅读 · 0 评论 -
React-Router实战:重定向Redirect
当用户访问某界面时,该界面并不存在,此时用Redirect重定向,重新跳到一个我们自定义的组件里。一、基础1、引入使用// 如果loggedIn 为 false, 则重定向跳转到 /home 页面import { Route, Redirect } from 'react-router'<Route exact path="/" render={() => ( ...原创 2019-03-23 18:55:45 · 75066 阅读 · 9 评论