![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
react面试题
文章平均质量分 54
闽南,
这个作者很懒,什么都没留下…
展开
-
说说 Real DOM 和 Virtual DOM 的区别?优缺点?
性能方面:使用 Virtual DOM,能够有效避免真实 DOM 数频繁更新,减少多次引起重绘与回流,提高性能。请求后,并不知道后续还有 9 次更新操作,因此会马上执行流程,最终执行 10 次流程。,意思为文档对象模型,是一个结构化文本的抽象,在页面渲染出的每一个结点都是一个真实。跨平台:React 借助虚拟 DOM,带来了跨平台的能力,一套代码多端运行。来完成页面,繁琐又容易出错,在大规模应用下维护起来也很困难。目的就是为了更好将虚拟的节点渲染到页面视图中,虚拟。节点,浏览器没这么智能,收到第一个更新。原创 2023-07-25 11:26:34 · 2924 阅读 · 0 评论 -
React实现添加购物车小车抛物线
立方贝赛尔曲线: cubic-bezier.com (可以设置好曲线弧度,直接复制)向页面底部抛掷小球,css动画, 立方贝塞尔曲线。点击按钮,先将小球移到点击的地方。设置个定时器(可以重复点击)创建一个小球Div ,原创 2023-05-08 10:07:25 · 2894 阅读 · 0 评论 -
React项目开发的代码规范。
在utils中的tools.js中我们一些配置,比如我们request当中axios创建的baseURL在外面被抛出引入。在以后公司开发项目中我们的代码由于是多人开发不是一个人的开发,那么我们应该把一个模块分成多个模块来分开去实现。我们平时项目中请求axios直接在项目当中请求,但是我们以后大多使用都是封装到外部,通过抛出引入来使用。pages是我们的路由组件,我们使用路由的组件在此当中。router是我们的路由配置信息,我们的路由配置在当中。我们在src/services下封装我们的接口。原创 2023-06-27 19:35:04 · 2992 阅读 · 0 评论 -
react中如何实现pc端原生拖拽?遇到的一些问题
2、鼠标坐标我们获取到了 但是我们拖拽时还需要获取到盒子的偏移量,因为我们拖动盒子时它的x坐标y坐标都会移动,我们可以通过获取当前点击的xy坐标与鼠标移动时xy坐标做对比,使第一次按下时准备拖拽盒子的xy坐标-我们移动时的xy坐标 +我们盒子偏移量也就是我们当前盒子的offsetLeft/offsetTop来获取到当前距离左侧与距离顶部的距离。1、当我们需要拖拽的时候我们首先需要鼠标按下去拖拽,因此我们需要获取到我们鼠标按下时鼠标的x坐标和y坐标。3、我们更改盒子左侧顶部距离,我们需要给盒子设置绝对定位。原创 2023-06-12 17:31:28 · 2944 阅读 · 0 评论 -
props 和 state 的区别?render在哪些情况中会执行?
两种方式更新数据都会出现的问题就是拷贝问题,由于对数据更新只有一层在更新数据时有时会出现更新页面不刷新问题,因此可以使用...扩展运算符进行展开来解决深浅拷贝问题。1、在类组件中我们调用setState进行状态更新的时候会触发render渲染(注意:不要再生命周期函数中调用setState会出现死循环问题)都是普通的 JavaScript 对象。2、在函数组件中我们使用useState对数据更新时会触发render渲染。render方法两种情况下会执行。原创 2023-05-12 16:18:11 · 2844 阅读 · 0 评论 -
redux本来是同步的为什么它能执行异步代码?实现原理是什么?中间件的实现原理是什么?
这个函数执行的是一个异步操作,fetch一段数据,在fetch之前发出一个pending action,成功后再发出一个success action。redux-thunk是最常用的异步中间件,它让disptach能接收函数作为参数,使得我们能在actionCreator中返回一个函数,在这个函数中设计异步操作,并在异步操作的开始和结束时刻发送action来控制视图的渲染。如果是函数,执行它(相当于截获了它)。好了,我们现在已经明确,在发起异步的时候一个action,执行完异步后一个action。转载 2023-05-08 10:19:51 · 2880 阅读 · 0 评论 -
react中的props.children使用map函数来遍历会收到异常显示,为什么?应该如何遍历?
在ReactJs中,props.children不一定是数组。this.props.children的值有三种可能。原创 2023-05-08 09:47:52 · 2879 阅读 · 0 评论 -
react提高性能的方法?
我们文中列出的基本上是React内部提供的性能优化方法,这些方法可以帮助React更好地执行,并没有列出例如Immutable.js第三方工具库的优化方法。其实性能优化的方法有很多,但正如上面所说的,合适的方法也要在合适的场景下使用,过度的使用性能优化反而会得不偿失。转载 2023-05-08 09:16:27 · 2892 阅读 · 1 评论