![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
react
文章平均质量分 90
八块腹肌的哥哥
这个作者很懒,什么都没留下…
展开
-
React基础入门(路由传参,NavLink,redux) --第三篇
NavLink的介绍 他可以实现路由的高亮,NavLink比Link高级一点,他自身有一个属性点击哪个路由就会自动给点击的那个路由添加一个类名为active的属性,如果不喜欢这个样式,也可自行用activeClassName给他添加一个自定义的类名,注意:这里如果使用bootStrop的情况,因为普通的类权重低,所以样式会被bootstarp覆盖,这里加上! important就ok了. <NavLink activeClassName="atdh" to="/Home">home跳转</原创 2021-07-30 19:44:47 · 1075 阅读 · 0 评论 -
React基础入门(虚拟DOM,Diff算法和React路由) --第三篇
虚拟DOM 本质上就是一个JS对象,用来描述你希望在屏幕上看到的内容 Diff算法 执行过程 初次渲染时,React会根据初始化的state(model),创建一个虚拟DOM对象(树) 根据虚拟DOM生成真正的DOM,渲染到页面 当数据变化后(setState()),会重新根据新的数据,创建新的虚拟DOM对象(树) 与上一次得到的虚拟DOM对象,使用Diff算法比对(找不同),得到需要更新的内容 最终,React只将变化的内容更新(patch)到DOM中,重新渲染到页面 代码演示 组件rende转载 2021-07-29 20:19:46 · 203 阅读 · 0 评论 -
React基础入门(JSX与React组件基础,进阶) --第二篇
接着上篇补充一下JSX的剩余基础知识 1. JSX 中使用 JavaScript 表达式 嵌入 JS 表达式 数据存储在JS中 语法:{ JavaScript表达式 } 注意:语法中是单大括号,不是双大括号! const name = 'Jack' const dv = ( <div>你好,我叫:???</div> ) 嵌入 JS 表达式 const name = 'Jack' const dv = ( <div>你好,我叫:{name}</div> )原创 2021-07-27 21:13:38 · 322 阅读 · 1 评论 -
React基础入门(React 基础与JSX) --第一篇
1.React 基础 1.1React 概述 1.1.1什么是React? React 是一个用于构建用户界面的 JavaScript 库。 用户界面:HTML页面(前端) React 主要用来写HTML页面,或构建Web应用 1.1.2React的特点 声名式 基于组件 学习一次,随处使用 声明式: 你只需要描述 UI(HTML)看起来是什么样,就跟写HTML一样 React 负责渲染 UI,并在数据变化时更新 UI 代码: const jsx = <div className="app"&g原创 2021-07-26 20:34:33 · 228 阅读 · 0 评论