- 博客(13)
- 收藏
- 关注
RSS订阅原创 react高阶组件
高阶组件是一个接替Mixin实现抽象组件公共功能的好方法。高阶组件其实是一个函数，接收一个组件作为参数，返回一个包装组件作为返回值，类似于高阶函数。高阶组件和装饰器就是一个模式，因此，高阶组件可以作为装饰器来使用。高阶组件有如下好处：封装并抽离组件的通用逻辑，让此部分逻辑在组件间更好地被复用。...
2019-04-29 18:02:20
132
原创 react-router
hashHistory.push(/relationshipTop5?personId=${personId})首页 Route path="/" component={InitialSearch} />
2019-04-29 17:50:46
146
原创 Promise,async,await,fetch
promise是一个构造函数，内部接收一个回调函数。回调函数内部有两个参数,reslove是执行成功的时候调用的，reject是失败调用的Promise.all(iterator)Promise.race(iterator)promise.rejectpromise.resolveasync 和await联合起来使用相当于替代了Promise的then和catch方法await定...
2019-04-29 17:43:14
224
转载 flex布局
display:flex/inline-flex设为Flex布局以后，子元素的float、clear和vertical-align属性将失效。lex-direction 即项目的排列方向row（默认值）：主轴为水平方向，起点在左端。row-reverse：主轴为水平方向，起点在右端。column：主轴为垂直方向，起点在上沿。column-reverse：主轴为垂直方向，起点在下沿...
2019-04-29 17:37:13
262
原创 component和 purecomponent
componet是 react的组件对象，这个对象有一些自己的内置属性和方法：例如componentWillMount 这种，我们一般用的时候，就是重写这个函数。class App extends React.Component //写组件时候,就是继承这个对象.PureComponentReact15.3中新加了一个 PureComponent 类，只要把继承类从 Component...
2019-04-29 17:08:29
247
原创 虚拟dom及其优劣
什么是虚拟dom用js模拟一颗dom树,放在浏览器内存中.当你要变更时,虚拟dom使用diff算法进行新旧虚拟dom的比较,将变更放到变更队列中,反应到实际的dom树,减少了dom操作.虚拟DOM将DOM树转换成一个JS对象树,diff算法逐层比较,删除,添加操作,但是,如果有多个相同的元素,可能会浪费性能,所以,react和vue-for引入key值进行区分.优点:-虚拟DOM...
2019-04-29 16:36:57
6151
1
原创 call() 、 apply() 、bind() 、箭头函数
每一个Function对象都有一个apply()方法和一个call()方法它们各自的定义：apply：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B.apply(A, arguments);即A对象应用B对象的方法。arguments为b的参数.a为对象call：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B.call(A, args1,args2);即A对象调用B对...
2019-04-28 19:09:52
784
原创 Redux和Connect
Redux的作用:独立组件间实现状态通信.管理组件状态.使用Redux应该遵循一下原则：整个应用共享的state应该存储在store的状态树中，store是唯一的；state不能直接修改，只能通过action表达修改的意图，调用dispatch()修改state；state的修改规则reducers必须是一个纯函数，不能有副作用。Redux的数据流Store作为唯一的st...
2019-04-28 18:15:58
1338
原创 React生命周期总结
react的生命周期v16.0前的周期.1\组件挂载阶段:componentWillMount，render，componentDidMountcomponentWillMount:在组件挂载到DOM前调用，且只会被调用一次，以后组件更新不调用，整个生命周期只调用一次，可以修改第一次state的值，也可以把写在这边的内容提前到constructor()中，所以项目中很少用。rende...
2019-04-28 15:50:57
195
原创 整理部分性能问题
1\ webpack中的配置:一些插件:const OptimizeCssAssetsWebpackPlugin = require('optimize-css-assets-webpack-plugin');//css打包样式最小化,配置:entry入口处配置vendor,这样的话,就不会每个js都打共用插件进去,减少了js的体积.vendor.js中的内容基本上很少更新,并利用浏览器的...
2019-04-26 18:19:35
194
原创 基于webpack的react项目搭建
webpack的原理:主要分析你的项目结构，找到JavaScript模块以及其他一些浏览器不能直接运行的拓展语言（Scss、less、TypeScript），将其转换和打包为合适的格式供浏览器使用1\进入一个空文件夹,终端输入 npm init, 初始化packge.json 项目的依赖管理和脚本任务.2\npm install react react-dom react-redux re...
2019-04-26 17:41:08
338
原创 TypeScript学习
TypeScript学习TypeScript 是 JavaScript 的一个超集，主要提供了类型系统和对 ES6 的支持TypeScript 是 JavaScript 的一个超集，主要提供了类型系统和对 ES6 的支持好处:- 在编译阶段就发现大部分错误,增加了代码的可读性和可维护性- 可以定义从简单到复杂的几乎一切类型，TypeScript 编译报错，也可以生成 JavaScript...
2019-04-25 16:50:36
289
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人