react路由

一、React路由： 实现单页应用的核心技术（单页应用 简称SPA）

路由原理参考资料：

二、React路由实现有两个包：

官网： https://reacttraining.com/react-router/

官方github: https://github.com/ReactTraining/react-router

中文路由文档： http://reacttraining.cn/web/example/basic

三、React-router-dom具体使用

Route:视图展示 区 相当于vue中的router-view

Link:要跳转的指令 相当于vue中的router-link

步骤：

1.引入所需的包：

2.用Link指令指令要跳转的路径

例如：

3.指定在哪个区域显示视图

例如：

4.如何指定高亮

例如：

可以通过activeClassName指定高亮类的样式，如果不指定activeClassName，可以直接使用active类名即可

5.路由传参

Reacr UI库 antd: 阿里

文档 https://ant.design/docs/react/introduce-cn

创建初始值。在react中d框里的值是需要一开始就设置的，可以先创建初始值，它与后者是相互联系的，d框里的值就可以设置，作为d窗的条件在组件中调用控制useState初始值的函数，并对其进行赋值。

最近在做 react 的项目，在此之前，都是做的 vue 项目，所以对于 react 的使用都很不熟练。遇到的第一个问题，怎么控制元素的显示与隐藏，在 vue 中常用 v-if 和 v-show 指令。 react 中用什么方法呢？

下面说我知道的三种方法：

类似于 vue 的 v-if

方法是通过变量来控制是否加载元素的，如果变量为 false ，内容就直接不会渲染的。

类似于 vue 中的 v-show

通过 display 属性来控制元素显示与隐藏

通过 className 切换类名来实现元素的显示和隐藏。

第一种方法不适合频繁控制显示隐藏的情况，因为它会重新渲染元素，比较耗费性能。

---