![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React
red_heel
Find a right way, then use all ways to go to top. 既然选择一个方向,那么就把它做好
展开
-
Web Workers 在React项目中应用/Web Workers 性能优化
弄清楚webWorker,我们首先要弄清楚几个问题1. JavaScript为什么是单线程在前端JavaScript操作DOM树,其实通过调用浏览器API来操作DOM树的 ,如果JavaScript是多线程的,那意思就是我们可以一边对DOM树的同一节点既做增加的行为也可以做删除的操作,这岂不是乱套了。2. 为什么需要异步由于JavaScript是单线程的,所以当执行Javascri...原创 2019-08-24 12:02:20 · 986 阅读 · 0 评论 -
socketjs, stomp-client,react, redux-observable 搭建一个基于stomp over websocket的前端服务
最近小编接到一项紧急任务:国外同事让让我三天搭建一个基于stomp 协议的websocket服务。这项服务允许用户在切换region的时候订阅后端对应的topic.由于小编最近 有点忙,废话不说先上代码。后续补充理论import SockJS from 'sockjs-client'import Stomp from 'stompjs'import { Observable, Subject } from 'rxjs'export default class AutoConnectWeb.原创 2020-05-23 15:36:08 · 848 阅读 · 0 评论 -
React context 实现组件联动功能
我们知道React Context 已经出现有一段时间了并且随着hook的盛行,我们更多的发掘出了Context的价值。Context是可以像Redux一样用来管理状态,不知道你有没有像我一样有这个疑问,那既然Redux就可以管理状态,为什么要使用Context呢?现在我的理解呢是由于Context API不像Redux那样依赖很多第三方库。但是并不是说Context就可以代替Redux的...原创 2020-03-17 20:27:11 · 550 阅读 · 0 评论 -
DOM 性能案例研究
我有一个有趣的问题想问你,你最后一次使用原生DOM API创建你的真实的项目是什么时候了,是的,你也许也不记得是什么时候了。你知道的,我们可以利用DOM API来和HTML做任何交互。 但是现在我们可以使用当下流行的UI框架以及库来搭建我们的UI,例如React,VUE,Angular。所以在不使用框架来将我们的代码编译成为HTML/CSS/JS的情况下,你大部分还是要基于DOM AP...翻译 2019-10-30 11:43:48 · 153 阅读 · 0 评论 -
如何模拟section timeout && session 与cookie关系
最近遇到一个小需求就是:当用户停留某个页面超过4个小时的时候,这个时候如果用户做任何交互行为,都给用户一个弹窗,提醒用户登陆超时需要重新登陆等信息。拿到这个需求的时候,心中窃喜,分析了一下,当用户与页面做交互的时候,比如发送请求的时候,后端会返回当sesstion timeout 的时候,返回给前端的某个标记sesstion timeout 的属性,我只需要判断这个标记信息,然后作出是否有...原创 2019-08-24 11:38:21 · 378 阅读 · 0 评论 -
::在React 中的意义
我在看一些项目的时候遇到了::这种写法,查了之后才知道这种是ES7针对.bind的新语法。例如:在React中我们常见的写法是<button onClick={this.handleClick,bind(this)}></button>,那么ES7中我们可以按照如下格式方法书写:<button onClick={::this.handleClick}>&...原创 2018-10-24 14:58:01 · 428 阅读 · 0 评论 -
何处处理获取数据逻辑:componentWillMount vs componentDidMount
我们都很清楚,render不是一个很好的处理获取数据或者任何异步操作的位置,它在某种程度上会更改状态或者导致一些其他影响componentWillMountReact会在组件第一次执行render方法前执行这个方法,乍一看它时处理获取数据逻辑的很完美的地方。但是我们一般都是通过异步请求API的方式来获取数据,这就意味着我们还没有获取到数据而render方法已经被执行了。我们没有办法暂停render...翻译 2018-02-28 09:38:54 · 5076 阅读 · 1 评论 -
使用func作为setState的参数
我们知道一个react 组件状态发生变化时,render方法会被调用。 所以对于组件状态变化时,我们可以在render这个方法体内执行某个动作,那么问题就来了,为什么需要func作为setState的回掉函数呢?查了些资料终于弄明白了:1. 原来setState是以异步的方式来运作的。这就意味着在调用setState之后,this.state这个变量对象并没有立即改变。所以如我们想要直接原创 2018-02-05 17:58:47 · 560 阅读 · 0 评论 -
React select
原文:https://reactjs.org/docs/forms.html#why-select-value在HTML中用来创建下拉框,例如:select> option value="grapefruit">Grapefruitoption> option value="lime">Limeoption> option selected value="coconut">翻译 2018-02-02 13:31:22 · 3116 阅读 · 2 评论 -
Props、State在React中的不同
Props、State在React中的不同翻译 2018-01-02 10:17:29 · 250 阅读 · 0 评论