[20190618]日常学习记录(二)-flex属性及vue实战

博客总结了flex属性优缺点,其与浮动相比代码少、更灵活,在移动端可放心使用。还介绍了vue实战中兄弟组件间数据传递思路,以及js性能优化方法,如在特定生命周期取dom属性值、函数截流等。

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

为什么使用flex,

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

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

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

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

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

 

下午学vue的实战

兄弟组件间数据传递,

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

js性能优化,

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

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

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

 

转载于:https://www.cnblogs.com/jimfigo/p/11048827.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值