2 haoyanyu_

尚未进行身份认证

暂无相关简介

等级
TA的排名 8w+

Vue—nextTick的实现原理

使用nextTick全局使用://DOM还没有更新Vue.nextTick(function(){//DOM更新了})//作为一个Promise使用Vue.nextTick().then(function(){//DOM更新了})实例方法:newVue({//...methods:{//...e...

2019-10-09 10:44:31

React系列: setState以及setState更新机制

在React中,数据是自顶向下单向流动的,即从父组件到子组件。这样组件之间的关系变得简单并且可预测。state和props是React组件中最重要的改建,如果顶层组件初始化props,那么React会向下遍历整颗组件树,重新尝试渲染所有的子组件。而state只关心每个组件自己内部的状态,这些状态只能在组件内部改变。当组件内部使用内置方法setState时,该组件就会尝试重新渲染,因为我们改变...

2019-09-24 17:57:21

React系列:React的生命周期

React声明周期React组件的生命周期可以分为挂载,渲染,卸载几个阶段。组件挂载时:classAppextendsComponent{ staticpropTypes={ //... }; staticdefaultProps={ //... }; constructor(props){ super(props); this.sta...

2019-09-25 09:26:32

React系列:组件性能优化 (shouldComponentUpdate, PureComponent, PureRender, Immutable)

react中有时候会有一些不必要的render,例如:1.父组件传递props给子组件,即使props没有更新,子组件也会重新render;2.setState两次值相同,也会render优化方法1.shouldComponentUpdateshouldComponentUpdate接受两个参数,要更新的props和state,返回true或者false来确定是否要执行render;...

2019-09-18 17:32:28

React系列: redux - bindActionCreators的使用方法

react-redux的connect方法接受4个参数:mapStateToProps(state,[ownProps])接受完整的redux状态树作为参数,返回对象的所有key都会成为组件的propsmapDispatchToProps(dispatch,[ownProps])接受redux的dispatch方法作为参数,返回当前组件相关部分的actioncreator并可以在...

2019-09-17 15:00:41

vue-router源码分析(二)--HTML5History

首先:HTML5History也继承自HistoryvarHTML5History=(function(History$$1){...})(History)functiongetLocation(base){//处理urlvarpath=decodeURI(window.location.pathname);if(base&&pa...

2019-09-03 23:10:36

VueRouter源码(三)--RouterView, RouterLink

注册为vue组件RouterView和RouterLink组件在install方法中注册成了Vue的组件functioninstall(Vue){...Vue.component('RouterView',View);Vue.component('RouterLink',Link);...}RouterViewvue-router.jsline4...

2019-09-11 14:27:58

vue里使用bpmn绘制流程图(四)

1.替换节点汉化点击扳手图标可以将当前节点替换成新的节点。节点名称默认是英文,此处可以汉化控制弹框显示的源码在bpmn-js\lib\features\popup-menu\ReplaceMenuProvider.js中importtranslationfrom'./translationsGerman';//引入翻译文件ReplaceMenuProvider.proto...

2019-09-11 09:18:18

vue里使用bpmn绘制流程图(三)

自定义工具栏和节点形状工具栏的源码在bpmn-js\lib\features\palette\PaletteProvider.js中PaletteProvider中定义了getPaletteEntries方法,用于新增工具栏项目PaletteProvider.prototype.getPaletteEntries=function(element){...//这里就是工具栏内容,...

2019-09-10 18:06:32

vue里使用bpmn绘制流程图(二)

上回记录到在页面上生成并编辑流程图;但是实际使用中,往往需要进行自定义;下面就根据实际需求来一步一步实现自定义。不同的节点用不同的颜色区分插件提供的接口方法this.viewer.importXML(diagramXml,err=>{ if(err){ throw(err) } varoverlays=this.viewer.get('overlay...

2019-09-10 17:16:54

vue里使用bpmn绘制流程图(一)

安装1.HTML中使用,通过script标签引入<scriptsrc="https://unpkg.com/bpmn-js@5.0.3/dist/bpmn-modeler.development.js"></script>2.npm安装bpmn-jsnpminstallbpmn-jsnpminstallbpmn-js-properties-panel...

2019-09-10 16:06:38

H5把页面表格数据导出到本地文件,导出为本地csv文件

参考iview的表格导出导出表格需要有表头数据和具体数据//表头letcolumns=[ {title:'品牌',key:'brandName'}, {title:'品种',key:'breedName'}, {title:'平均零售价',key:'avgRetailPrice'}, {title:'平均批发价',key:'avgBat...

2019-08-27 15:34:27

Compression Plugin Invalid Options options should NOT have additional properties

webpack打包时想要压缩js和css文件,按照以前的项目拷贝了如下配置newCompressionWebpackPlugin({asset:'[path].gz[query]',algorithm:'gzip',test:newRegExp('\\.(js|css)$'),threshold:...

2019-08-26 13:59:39

vue 双向数据绑定(补充)--数组

上回写到,vue里通过newObserver实例,来对数据进行劫持,重写get和set,在set里会触发订阅者的更新,从而实现数据同步更新。补充一下数组的处理varObserver=functionObserver(value){this.value=value;this.dep=newDep();//1订阅者容器,用于存放所有订阅者...

2019-08-23 11:53:03

Vue双向数据绑定的原理源码解析

vue的双向数据绑定通过数据劫持+发布订阅实现的数据劫持的实现vuejs里定义了一个observe(value,asRootData)方法,该方法会检测传入的value是否已经被劫持过,如果是直接返回,如果不是,会用value实例化一个Observer实例,Observer方法中,通过Object.defineProperty对对象属性的get和set方法进行了重写,从而在数据发生变化时...

2019-08-19 10:51:56

函数柯里化应用

函数柯里化把使用多个参数的函数转换成一系列使用一个参数的函数,返回接受余下参数并且返回结果的新函数;(也就是:只传递一个部分参数来调用这个函数,让他返回一个新函数去处理余下的参数)日常应用动态创建函数:(dom元素添加事件监听是,根据兼容性判断生成不同的函数)//只在函数第一次执行时判断一次,用到了闭包和立即执行函数constaddEvent=(function(){...

2019-08-12 16:16:55

安卓Android系统,H5页面键盘弹出后,页面挤压变形或者底部输入框被遮挡的解决办法

键盘弹出挤压页面至变形如下页面,背景图片height:100%;底部输入框部分用position:absolute定位,当键盘弹出时,页面整体被挤压;解决方法页面加载后获取视图高度为height,监听window.onresize,指定容器高度为height存在的问题:偶尔会出现input框获取焦点后,被键盘覆盖,但是在输入内容后滚动到可视区域的现象底部的输入框获焦后,被键...

2019-08-08 16:31:07

vue2项目从webpack3升级到webpack4过程全记录以及多页面打包

升级各种插件,尤其是babel系列,从6升级到了7babel7系列的安装大多是@babel/开头,至少需要安装以下插件 "@babel/core":"^7.4.5",//核心包"@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/plugin-transform-runtime":"^7.4.4",...

2019-07-29 15:08:00

https通信机制(http + ssl/tls)

https(http+ssl)https协议不是应用层的新协议,只是HTTP通信接口部分用SSL或TLS协议代替 一般情况,HTTP直接和tcp通信,使用SSL时,变成HTTP先和SSL通信,然后SSL在和TCP通信 SSL独立于HTTP,其他运行在应用层的协议,比如SMTP,Telnet等都可以配合SSL使用SSL采用的是公开密钥加密:公开密钥加密:非对称的秘钥,一把私有秘...

2019-07-29 11:02:57

nvm管理node版本

1,安装nvm下载链接nvm安装包选择“nvm-noinstall.zip”包下载2,解压安装包,双击indtall.cmd,输入nvm包所在的路径,C:\nvm-noinstall然后回车例如解压到C:\nvm-noinstall3,生成setting.txt文件后,输入root:C:\nvm-noinstallpath:C:\nvm-noinstall\nodejsarch...

2019-07-09 11:11:52

查看更多

勋章 我的勋章
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 勤写标兵Lv2
    勤写标兵Lv2
    授予每个自然周发布4篇到6篇原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。