react
文章平均质量分 92
小北lulu
做一只前端小精灵吧
展开
-
React 基础知识点总结
1. React 介绍React 是一个用于构建用户界面的 JavaScript 库,它只负责应用的视图层,帮助开发人员构建快速且交互式的 web 应用程序。React 使用组件的方式构建用户界面。2. JSX 语法在 React 中使用 JSX 语法描述用户界面,它是一种 JavaScript 语法扩展。在 React 代码执行之前,Babel 会将 JSX 语法转换为标准的 JavaScript API。JSX 语法就是一种语法糖,让开发人员使用更加舒服的代码构建用户界面。2.1 在 JS原创 2021-02-01 20:46:49 · 288 阅读 · 0 评论 -
React 性能优化
说起 react 的性能优化,首先,高效的虚拟 DOM diff 算法和 react 内部的引擎已经做的很完美了,一般项目已经够用了,对性能的需求要求并不大,但是对于复杂的项目,性能优化还是很有必要的,性能到底指的是什么?前端开发,自然是离不开浏览器,而前端的性能优化大多都是在和浏览器打交道,页面的每一帧变化都是有浏览器绘制出来的,而且这个绘制的频率受限于显示器的刷新频率,所以一个重要的性能数据指标是每秒 60 帧的绘制频率,绘制的每一帧大概是需要 16.6ms。如果一个应用对用户的交互响应处理过慢,原创 2020-10-28 21:40:04 · 335 阅读 · 0 评论 -
react组件事件代理的原理
React的事件系统和浏览器事件系统相比,主要增加了两个特性:事件代理、和事件自动绑定。1、事件代理区别于浏览器事件处理方式,React并未将事件处理函数与对应的DOM节点直接关联,而是在顶层使用了一个全局事件监听器监听所有的事件;React会在内部维护一个映射表记录事件与组件事件处理函数的对应关系;当某个事件触发时,React根据这个内部映射表将事件分派给指定的事件处理函数;当映射表中没有事件处理函数时,React不做任何操作;当一个组件安装或者卸载时,相应的事件处理函数会自动被添加到事.原创 2020-06-20 20:51:46 · 1745 阅读 · 0 评论 -
react-router 路由的实现原理
React Router 是一个基于 React 之上的强大路由库,它可以让你向应用中快速地添加视图和数据流,同时保持页面与 URL 间的同步。本文从两个方便来解析 react-router 实现原理。一:介绍 react-router 的依赖库history;二:使用 history 库,实现一个简单的 react-router 路由。history 介绍:history 是一个 JavaScript 库,可让您在 JavaScript 运行的任何地方轻松管理会话历史记录。history 抽象出各种环原创 2020-06-20 20:31:16 · 445 阅读 · 0 评论 -
Component,Functional Components 和 PureComponent 的区别
Component :一定要配套使用shouldComponentUpdate , 否则不管props orstate是否更新组件一定更新pureComponent :当组件的props和state不变时,组件是不更新的。也就是说PureComponent通过props和state的浅对比来实现shouldComponentUpdate(),函数式组件的优势:函数组件比类组件更加简洁.函数组件看似只是一个返回值是DOM结构的函数,其实它的背后是无状态组件(Stateless Comp..原创 2020-06-20 18:27:54 · 836 阅读 · 0 评论 -
对react生命周期的简单详细理解
react 生命周期可分为四个阶段挂载(mount)——组件在这个阶段被创建然后被插入到 DOM 中;更新(update)——React 组件“成长”;卸载(unmount)——最后阶段;错误处理(error handle)——有时候代码无法运行或某处出现了错误。react的新的生命周期图:与mounting相关的生命周期方法:render()constructor(props)componentDidMount()static getDerivedStateFromPr原创 2020-06-19 16:52:16 · 372 阅读 · 0 评论