react总结之react-router-dom

简介: react总结之react-router-dom

前言

接上篇博客


一、react-router-dom是什么?

它是基于react-router,加入了在浏览器运行环境下的一些功能:


 Link组件,会渲染一个a标签;


   BrowserRouter组件,使用pushState和popState事件构建路由;


 HashRouter组件,使用window.location.hash和hashchange事件构建路由。


 react-router-native: 基于react-router,类似react-router-dom,加入了react-native运行       环境下的一些功能。


二、使用步骤

1.首先安装react-router-dom

安装方法如下(示例):


首先要在你的项目里面打开cmd命令行输入

npm install react-router-dom --save


2.接下来我们就可以在package.json里看到这样一行代码(这就代表安装成功)


b7ce9fafb8634d2a9e3a696dbe59d147.png


总结

这就是react-router-dom安装的方法,react-router-dom制作路由的方法在我的博客里有写到


如何制作react的路由


相关文章
|
1月前
|
JavaScript 前端开发 算法
React技术栈-虚拟DOM和DOM diff算法
这篇文章介绍了React技术栈中的虚拟DOM和DOM diff算法,并通过一个实际案例展示了如何使用React组件和状态管理来实现动态更新UI。
34 2
|
2月前
|
JavaScript 前端开发 算法
react中虚拟dom和diff算法
在React中,虚拟DOM(Virtual DOM)和Diff算法是两个核心概念,它们共同工作以提高应用的性能和效率。
31 4
|
22天前
|
JavaScript 前端开发
react学习(3)创建虚拟dom的两种方式
react学习(3)创建虚拟dom的两种方式
164 67
|
8天前
|
XML JavaScript 前端开发
学习react基础(1)_虚拟dom、diff算法、函数和class创建组件
本文介绍了React的核心概念,包括虚拟DOM、Diff算法以及如何通过函数和类创建React组件。
15 2
|
8天前
|
JavaScript 前端开发
react字符串转为dom标签,类似于Vue中的v-html
本文介绍了在React中将字符串转换为DOM标签的方法,类似于Vue中的`v-html`指令,通过使用`dangerouslySetInnerHTML`属性实现。
20 0
react字符串转为dom标签,类似于Vue中的v-html
|
2月前
|
JavaScript 前端开发 容器
React基础入门之虚拟dom【一】
【8月更文挑战第14天】React基础入门之虚拟dom
33 0
React基础入门之虚拟dom【一】
|
2月前
|
JavaScript 前端开发
React——虚拟DOM创建的两种方式【二】
React——虚拟DOM创建的两种方式【二】
26 0
|
4月前
|
JavaScript 前端开发 算法
虚拟DOM是React的关键技术,它是个轻量的JS对象树,模拟实际DOM结构。
【6月更文挑战第27天】虚拟DOM是React的关键技术,它是个轻量的JS对象树,模拟实际DOM结构。当状态改变,React不直接修改DOM,而是先构建新的虚拟DOM树。通过 diff 算法比较新旧树,找到最小变更,仅更新必要部分,提高性能,避免频繁DOM操作。虚拟DOM还支持跨平台应用,如React Native。它优化了更新流程,简化开发,并提升了用户体验。
34 1
|
3月前
|
JavaScript
react18【系列实用教程】useRef —— 创建 ref 对象,获取 DOM (2024最新版)
react18【系列实用教程】useRef —— 创建 ref 对象,获取 DOM (2024最新版)
39 0
|
3月前
|
网络架构
react18【系列实用教程】react-router-dom —— 路由管理 (2024最新版)
react18【系列实用教程】react-router-dom —— 路由管理 (2024最新版)
58 0