React
文章平均质量分 95
React
故里有长安丶丶
这个作者很懒,什么都没留下…
展开
-
React(1)—— React简介、JSX语法、虚拟DOM
文章目录1.React简介1.1 React是什么?1.2 原生JS的缺点【补充】什么是浏览器重绘重排?【补充】什么是模块化?什么是组件化?1.3 React的优势1.4 React高效的原因2.JSX语法2.1 JSX简介2.2 JSX的使用规范3.虚拟DOM3.1 虚拟DOM是什么?其本质是?3.2 代码展示1.React简介1.1 React是什么?用于动态构建用户界面的 JavaScript 库(只关注于视图)发送请求获取数据处理数据(过滤,整理格式等)操作DOM呈现页面(React原创 2021-12-01 21:52:58 · 904 阅读 · 0 评论 -
React(2)—— React组件、组件实例三大属性、事件处理、受控组件与非受控组件、高阶函数、函数柯里化
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言1.React组件的分类1.1函数式组件1.1.1函数式组件特点:1.1.2函数式组件的基本写法:1.1.3【补充】严格模式中的this1.2类式组件1.2.1函数式组件特点:1.2.2函数式组件的基本写法:2.组件实例三大属性2.1 state属性2.2 props属性2.3 refs属性2.读入数据总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启原创 2021-12-04 11:48:56 · 1305 阅读 · 0 评论 -
React(3)—— 组件的生命周期、Diffing算法
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言1. 组件的生命周期1.1 理解1.2 案例1.3 生命周期的三个阶段(旧)1.3.1 初始化阶段1.3.3 卸载组件1.4 生命周期的三个阶段 (新)1.4.1 初始化阶段1.4.2 更新阶段1.4.3 卸载组件1.5 重要的勾子1.6 即将废弃的勾子2. 虚拟DOM与DOM Diffing算法2.1 基本原理图2.2 关于key的经典面试题二、使用步骤总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能原创 2021-12-09 16:45:28 · 108 阅读 · 0 评论 -
React(4)—— 使用create-react-app创建一个React项目
文章目录一、使用create-react-app创建react应用1.1. react脚手架1.2. 创建项目并启动1.3. react脚手架项目结构1.4. 功能界面的组件化编码流程(通用)二、脚手架版 Hello React2.1 注意事项2.2 文件目录2.3 代码index.htmlindex.jsApp.jsHello.jsxHello.cssWelcome.jsxWelcome.css2.4 页面三、 VSCode【插件】生成代码模板一、使用create-react-app创建react应用原创 2022-01-04 14:25:01 · 2373 阅读 · 0 评论 -
React(5)—— React模块化案例 - TodoList
文章目录一、目标功能界面二、界面模块拆分三、搭建静态页面index.jsApp.jsxApp.cssHeader/index.jsHeader/index.cssList/index.jsxList/index.cssItem/index.jsxItem/index.cssFooter/index.jsxFooter/index.css页面效果四、实现动态组件4.1 动态初始化页面App.jsxList/index.jsxItem/index.jsx4.2 动态添加todoApp.jsxHeader/ind原创 2022-01-04 15:35:27 · 1007 阅读 · 1 评论 -
React(6)—— Ajax - axios - 配置代理解决跨域问题 -消息订阅/发布机制 - PubSubJS - Fetch - github用户搜索案例
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一、理解1. 前置说明2. 常用的ajax请求库二、axios1. 文档2. 相关API三、React中配置代理解决跨域问题1. 配置代理方法2. 配置多个代理方法四、案例 —— github用户搜索1. 效果2. React 实现2.1 静态页面拆分实现2.2 动态交互实现2.3 优化用户体验五、消息订阅/发布机制1. 介绍PubSubJS库2. 在案例中使用六、Fetch1. 文档2. 特点3. 实例演示七、总结前言提原创 2022-01-05 07:49:47 · 527 阅读 · 0 评论 -
React(7)—— SPA应用 - React路由机制 - react-router-dom
文章目录一、理解1. SPA的理解2. 路由的理解2.1 什么是路由?2.2 路由的分类1. 前端路由2. 后端路由3. react-router-dom 的理解二、react-router-dom相关API1. 内置组件2. 其它三、路由的使用1. 效果2. 准备3. 路由的基本使用4. 实现index.jsApp.jsx5. 路由组件与一般组件的区别6. NavLink与封装NavLink7. Switch的使用8. 解决多级路径刷新页面样式丢失的问题9. 路由的严格匹配与模糊匹配10. Redirec原创 2022-01-05 09:08:40 · 669 阅读 · 0 评论 -
React(8)—— Redux - 三大核心概念 - store - reducer - actionn - Redux调试工具 - React-redux - 纯函数 - 高阶函数
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录一、Redux的理解1. 相关文档2. Redux是什么?3. 什么情况下需要使用Redux?4. Redux的工作流程二、Redux的三大核心概念1. store2. reducer3. action三、API1. createStore()2. store对象3. applyMiddleware()4. combineReducer()四、使用redux编写应用1. 效果2. 实现redux/store.jsredux/cou原创 2022-01-06 16:08:18 · 180 阅读 · 0 评论