早上在看flex属性,总结一下它的优缺点

为什么使用flex,

她和浮动相比,代码更少。浮动要考虑左浮动右浮动,有时还要去清除浮动。flex一行代码就搞定了。

她更灵活,实现平均分配,根据内容大小分配,自动边距实现左右推开,水平居中,垂直居中等等

她在IE10全面支持,IE8部分支持(带前缀)。

所以在移动端放心使用,客户端根据场景使用

客户端也可以结合浏览器检测库使用

下午学vue的实战

兄弟组件间数据传递,

一种简单思路是,子组件触发父组件事件,将数据传递给父组件,再由父组件传递给目标组件

js性能优化,

一个是定义组件的变量,要注意组件是否是由ajax数据渲染出来的,如果是,在取得dom元素的某些属性值,应当在change生命函数钩子中取得。

另外一个是减少函数触发实现截流,把要执行的代码放在settimeout中,延迟十几二十毫秒执行,赋值给一个timer,如果期间timer已经存在,就清除它以实现截流。

这些优化在touchmove这类不断触发的事件比较常用。

[20190618]日常学习记录(二)-flex属性及vue实战的更多相关文章

  1. Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客

    ==他的博客应该不错,没有细看 Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客 http://blog.csdn.net/u012706811/article/det ...

  2. JavaScript学习记录二

    title: JavaScript学习记录二 toc: true date: 2018-09-13 10:14:53 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...

  3. Material Calendar View 学习记录(二)

    Material Calendar View 学习记录(二) github link: material-calendarview; 在学习记录一中简单翻译了该开源项目的README.md文档.接下来 ...

  4. 2.VUE前端框架学习记录二

    VUE前端框架学习记录二:Vue核心基础2(完结)文字信息没办法描述清楚,主要看编码实战里面,有附带有一个完整可用的Html页面,有需要的同学到脑图里面自取.脑图地址http://naotu.baid ...

  5. Spring学习记录(二)---容器和bean属性配置

    下载spring包,在eclipse搭建spring环境. 这步我在eclipse中无法导入包,看网上的: http://sishuok.(和谐)com/forum/blogPost/list/242 ...

  6. Spring Boot学习记录(二)–thymeleaf模板

    自从来公司后都没用过jsp当界面渲染了,因为前后端分离不是很好,反而模板引擎用的比较多,thymeleaf最大的优势后缀为html,就是只需要浏览器就可以展现页面了,还有就是thymeleaf可以很好 ...

  7. 【java并发编程艺术学习】(四)第二章 java并发机制的底层实现原理 学习记录(二) synchronized

    章节介绍 本章节主要学习 Java SE 1.6 中为了减少获得锁 和 释放锁 时带来的性能消耗 而引入的偏向锁 和 轻量级锁,以及锁的存储结构 和 升级过程. synchronized实现同步的基础 ...

  8. SpringBoot学习记录(二)

    一. SpringBoot日志框架 SpringBoot:底层是Spring框架,Spring框架默认是用JCL(commons-logging): SpringBoot选用SLF4j和logback ...

  9. HTML5学习笔记<二>:元素,属性,格式化

    HTML元素 元素是指从开始标签到结束标签的所有代码. 开始(开放)标签 元素内容 结束(闭合)标签 <p> this is my web page </p> 没有内容的 HT ...

随机推荐

  1. 使用EA完成数据库设计

    开始重构之后对于EA的了解也逐渐增多,今天就总结一下如何使用EA完成对数据库的设计.下边的图分别是截自机房收费系统和牛腩新闻开发的数据库,因为我第一遍写的时候是在机房合作的时候,而后建立牛腩新闻发布系 ...

  2. CF-816B

    B. Karen and Coffee time limit per test 2.5 seconds memory limit per test 512 megabytes input standa ...

  3. html中NAME和ID区别

    html中NAME和ID区别 NAME 的最大作用就是可以与服务端进行交互.Struts2中要设NAME的属性才能在Action中取到值,ID取不到. id与name的作用,作为标签的标识符,基本上是 ...

  4. xgene:之ROC曲线、ctDNA、small-RNA seq、甲基化seq、单细胞DNA, mRNA

    灵敏度高 == 假阴性率低,即漏检率低,即有病人却没有发现出来的概率低. 用于判断:有一部分人患有一种疾病,某种检验方法可以在人群中检出多少个病人来. 特异性高 == 假阳性率低,即错把健康判定为病人 ...

  5. 利用memoize缓存到Redis出现多个参数同一个结果

    在为后端输出加入Redis缓存的过程中出现的问题. 在我利用Flask-restful架构的后端中,理所当然的利用装饰器marshal_with对我的返回数据进行格式化输出. 举个最简单的例子: fr ...

  6. 无监督学习:Neighbor Embedding(邻域嵌套)

    一 Manifold Learning 我们要做的是非线性的降维,data是分布在低维空间里面,只是被扭曲到了高维空间. 比如地球的表面是一个二维平面,但是被塞到一个三维空间中. Manifold就是 ...

  7. cinder存储服务

    一.cinder 介绍: 理解 Block Storage 操作系统获得存储空间的方式一般有两种: 1.通过某种协议(SAS,SCSI,SAN,iSCSI 等)挂接裸硬盘,然后分区.格式化.创建文件系 ...

  8. 四、python中表示组的概念与定义

    现实世界中总是存在一组一组的事物,如俄罗斯方块.游戏中的技能.世界杯总决赛(8个小组,每组4个队) 一.python中如何表示“组”的概念 1.列表 1)定义 [1,2,3,4,5] type[1,2 ...

  9. BOM核心API

    前言 我觉得前端中最难的不是业务逻辑,而是API太多,知道的太少. BOM是什么? BOM是Browser Object Model的缩写,即浏览器对象模型.浏览器对象模型提供了可以与浏览器窗口进行互 ...

  10. 洛谷P2939 [USACO09FEB]改造路Revamping Trails

    题意翻译 约翰一共有\(N\))个牧场.由\(M\)条布满尘埃的小径连接.小径可 以双向通行.每天早上约翰从牧场\(1\)出发到牧场\(N\)去给奶牛检查身体. 通过每条小径都需要消耗一定的时间.约翰 ...