Reat学习笔记4
相信很多初学react的朋友在研究组件的路由配置问题时都很困扰,我也是折腾了半天才搞明白的。
一般情况下路由配置包含path和component两个信息:
- component顾名思义是组件的意思,指的是要访问的组件的名称,这里要注意的是,如果是在根目录(src/page或者src/pages)下,直接用‘组件名’即可;
如果是别的目录,要加上组件的路径,比如‘test/HelloWorld'。
- path顾名思义是路径的意思,指的是在浏览器中访问该组件时,自己指定的路径,可以自己随意定义的,但要保证布局文件中的Link to和path一致;
path并不是你写代码时组件的存放路径,这里很容易迷惑人。
举个栗子:

上图中的文件目录page下,HelloWorld在根目录,而根目录下的Dashboard目录下又包含了三个组件,分别是Analysis、Monitor和Workplace,
http://localhost:8000/hello这是访问HelloWorld组件的网址,hello是自己定义的,因为它在根目录下,所以config里定义路由时直接写组件名即可;
而http://localhost:8000/dashboard/analysis是访问Analysis的网址,其中analysis是自己定义的,但他不在根目录下,所以要加上dashboard/,
如下图所示:

Reat学习笔记4的更多相关文章
- js学习笔记:webpack基础入门(一)
		之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ... 
- PHP-自定义模板-学习笔记
		1. 开始 这几天,看了李炎恢老师的<PHP第二季度视频>中的“章节7:创建TPL自定义模板”,做一个学习笔记,通过绘制架构图.UML类图和思维导图,来对加深理解. 2. 整体架构图 ... 
- PHP-会员登录与注册例子解析-学习笔记
		1.开始 最近开始学习李炎恢老师的<PHP第二季度视频>中的“章节5:使用OOP注册会员”,做一个学习笔记,通过绘制基本页面流程和UML类图,来对加深理解. 2.基本页面流程 3.通过UM ... 
- 2014年暑假c#学习笔记目录
		2014年暑假c#学习笔记 一.C#编程基础 1. c#编程基础之枚举 2. c#编程基础之函数可变参数 3. c#编程基础之字符串基础 4. c#编程基础之字符串函数 5.c#编程基础之ref.ou ... 
- JAVA GUI编程学习笔记目录
		2014年暑假JAVA GUI编程学习笔记目录 1.JAVA之GUI编程概述 2.JAVA之GUI编程布局 3.JAVA之GUI编程Frame窗口 4.JAVA之GUI编程事件监听机制 5.JAVA之 ... 
- seaJs学习笔记2 – seaJs组建库的使用
		原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ... 
- CSS学习笔记
		CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ... 
- HTML学习笔记
		HTML学习笔记 2016年12月15日整理 Chapter1 URL(scheme://host.domain:port/path/filename) scheme: 定义因特网服务的类型,常见的为 ... 
- DirectX Graphics Infrastructure(DXGI):最佳范例 学习笔记
		今天要学习的这篇文章写的算是比较早的了,大概在DX11时代就写好了,当时龙书11版看得很潦草,并没有注意这篇文章,现在看12,觉得是跳不过去的一篇文章,地址如下: https://msdn.micro ... 
随机推荐
- A bean with that name has already been defined in class path resource [org/springframework/transaction/annotation/ProxyTransactionManagementConfiguration.class] and overriding is disabled
			2019-12-19 13:26:17.594 WARN [main] o.s.boot.web.servlet.context.AnnotationConfigServletWebServerApp ... 
- oracle中utl_raw
			RAW,类似于CHAR,声明方式RAW(L),L为长度,以字节为单位,作为数据库列最大2000,作为变量最大32767字节.LONG RAW,类似于LONG,作为数据库列最大存储2G字节的数据,作为变 ... 
- Educational Codeforces Round 76 (Rated for Div. 2) D. Yet Another Monster Killing Problem 贪心
			D. Yet Another Monster Killing Problem You play a computer game. In this game, you lead a party of 
- MySQL数据库实战之优酷
			目录 一.项目总结三步骤 二.项目需求分析 三.搭建框架 四.ORM框架分析 五.数据库设计 六.项目中各个功能模块分析 七.项目中遇到的问题及怎么解决的 八.客户端代码框架 8.1 conf 8.1 ... 
- IT兄弟连 HTML5教程 HTML和CSS的关系
			HTML是描述网页的标记语言,是将内容放到网页上,虽然HTML本身也自带一些样式功能,通过自身的属性,来实现一些特定的效果,制作出来的只能是一个网页,而不是一个美观的网页.最主要的是在HTML里面,一 ... 
- Kubernetes之Pod使用
			一.什么是Podkubernetes中的一切都可以理解为是一种资源对象,pod,rc,service,都可以理解是 一种资源对象.pod的组成示意图如下,由一个叫”pause“的根容器,加上一个或多个 ... 
- Long Jumps CodeForces - 479D
			E - Long Jumps CodeForces - 479D Valery is a PE teacher at a school in Berland. Soon the students ar ... 
- idea使用lombok不生效的解决办法
			file-->setting-->plugins点击下方的 browse repositories. 搜索lombok plugin. 安装后,重启. file-->setting- ... 
- wpf datetime format
			<Style TargetType="{x:Type DatePickerTextBox}"> <Setter Property="Control.Te ... 
- python基础(20):序列化、json模块、pickle模块
			1. 序列化 什么叫序列化——将原本的字典.列表等内容转换成一个字符串的过程就叫做序列化. 1.1 为什么要有序列化 为什么要把其他数据类型转换成字符串?因为能够在网络上传输的只能是bytes,而能够 ... 
