什么是虚拟DOM(Virtual DOM) 1、 先来个简单粗暴的回答虚拟DOM就是一个JS对象,用他来描述真实DOM。 JS对象描述的DOM示例 2、官方回答 The virtual DOM (VDOM) is a programming concept where an ideal, or “virtual”, representation of a UI is kept in memory and 2019-05-17 JS技巧 > vue.js > react.js #JS技巧 #vue.js #react.js
新人写react项目时需要注意的那些事(连载中) 0、react并不是双向绑定 三大框架对比 所以类似input之类的标签没有类似vue的v-model,必须手动更新值 1234567<input type="text" value={this.state.newToDoList} onChange={(e)=>this.inputTextChange( 2019-04-18 react.js #react.js
css3中新增的那些计量单位 前言虽然知道css3中新增了很多计量单位,但是平常写代码时基本不太注重css之类的东西以至于都不晓得有vh,vw这种黑科技,这几天看视频教程时刚好遇到了,记录一下,方便以后使用。 1、宽高的计量单位 单位 含义 vw 相对于视口的宽度。视口被均分为100单位的vw vh 相对于视口的高度。视口被均分为100单位的vh 1.1 使用场景1.1.1不借助js的情况下实现word文档效 2019-03-26 CSS相关 #CSS相关
button按钮阻止双击选中文字 一般我们用span标签模拟按钮时总会遇到这样一种情况,即双击按钮时会触发系统的选中文字。解决方案给按钮加上user-select: none;这个属性。 这样就结束了吗?并没有!我们拓展一下,除了点击触发的事件以外如何让用户感知到他是实实在在的点击了按钮?当然是加上一些小动画了,来看demo关键代码如下: 12345678.btn:active { transform: trans 2019-02-20 CSS相关 #CSS相关
React Native踩坑指南 1.初次编译运行 React Native 应用时的坑首先按照react native的中文网上的说明,一步步搭建环境这边是没什么坑的,大部分都坑在react-native run-android真机运行这个上面。基本都是报错 :app:installDebug FAILED,这里的答案足够解决很多问题,但是!!!如果你的尝试了google到的所有答案,都还没解决的话可以试试升级下USB驱动…我就 2019-01-14 React Native #React Native
收藏一些炫酷的css效果(持续更新) css实现loading全屏加载动画 戳这里看demo 从右出来(类似翻页效果)123456.slider-enter-active, .slider-leave-active { transition: all .5s;}.slider-enter, .slider-leave-to { transform: translate3d(100%,0,0) 2019-01-03 CSS相关 #CSS相关
vue项目打包优化 前段时间腾讯云有优惠,买了个1核1G的云主机来放练手的项目,经过一波操作终于部署成功了,but首屏打开贼慢,于是来一波性能优化之旅。 首先看看项目加载了哪些文件 打马的部分是服务器的公网ip,我们发现加载最耗时的主要是两个文件一个是首屏的大图,另一个是vendor.2b23f6448b79423c7a25.js这个文件。下面我们来着手优化: 1、vue路由懒加载 当打包构建应用时,Javas 2018-10-24 vue.js > 性能优化 #vue.js #性能优化
nodeJs项目部署腾讯云完整流程 国庆死宅在家时看到腾讯云搞活动,云主机8块钱一个月,正好前段时间写了个node的后台管理系统,于是就买了3个月正好可以自己熟悉一下项目部署的全部过程。 0、登陆服务器如果你买的主机的系统不是centos 7.2的话,可以跟着腾讯云的文档来一步步走,如果你是和我一样的小白,买服务器的时候用的默认配置即操作系统是centos 7.2的话,可以参考这个文档进行登录。(ps:最开始我一直不能用wind 2018-10-03 项目部署 > node.js > linux #项目部署 #linux #node.js
数组对象如何去重 好久没更新博客,因为自从跳槽到现在的公司一直很忙,最关键技术栈竟然变成了jquery + bootstrap!!!很多代码封装无力,做了很多重复的活!!!好了,不吐槽了,转到今天的主题,如何给数组对象去重,举个栗子: 1234567[ {name:'test',age:12}, {name:'test1',age:13} 2018-09-27 JS技巧 > 数组 #JS技巧 #数组