Loading动画:
loading 准备了一个loading组件,用来写Loading动画。因为是全局Loading,所以在vuex中我定义了一个状态来控制这个Loading动画的显示隐藏当我请求数据的时候,我就把这个Loading的状态给他改为一个true然后让他显示咱们那个Loading然后当我数据请求成功之后给他隐藏掉 这一块我用的是拦截器来获取那个请求的状态。
拦截器:
首先我们下载axios用axios封装了一个拦截器刚开始那个Loading是默认隐藏的当我在页面挂载的时候让他那个Loading动画给显示把他的状态给改成true 当我的axios使用then请求成功之后在回调里面把Loading给他隐藏,如果你想自己封装的话可以使用axios.interceptors.request.use(function(config)){}这个就在你请求之前做了什么
axios.interceptors.response.use(function(config)){}请求之后又做了什么也就是数据获取完成之后我们要做什么事请
闭包:
闭包我的理解就是函数嵌套当我一个函数里面套用另一个函数当我们那个内部函数使用外部函数的参数或者方法或属性的时候,外部函数在引用这个内部函数时他就形成了一个闭包。
也就时说一个函数执行完毕以后定义在内部的变量会被浏览器的垃圾回收机制所收回,但是闭包这样的并不会,因为内部函数依旧引用了外部函数的参数所以并不会被收回而是长期驻扎在内存当中
就好比我们现在有一个函数我在内部定义了一个var a=1 ;a++ 然后alert这个a然后那我在调用一下这个函数alert出来a是个2然后我再次调用这个a他还是2 ,因为他这个浏览器不会储存这个a的值所以当我们再次调用的话他就会从新计算。但闭包就不会重新计算他会存在内存中当我们再次调用的时候内存中的值会再次加一他不会重新去计算这个值。
实际应用:
假如页面上有5个button,要给button绑定onclick事件,点击的时候,弹出对应button的索引编号
你循环他的长度之后你会发现你点击之后结果都是5因为onclick他是异步触发的当你在点击之后for循环已经执行完毕了那么i的值也就变成5了所以不管你点击那个结果都是5
在这里我们就可以使用闭包来解决这种问题了 在闭包的作用下,定义事件函数的时候,每次循环的i值都被封闭起来,当我们点击不同的i的时候就会得到不同的值
css盒模型 :::
盒模型分为标准盒模型,和IE盒模型
区别:::
标准盒模型在我们计算他的宽和高的时候只计算content就可以了
IE盒模型在我们计算他的宽和高的时候他包含了border 和padding还有content
css如何设置两种模型::
/* 标准模型 */ : box-sizing:content-box;
/*IE模型*/ :box-sizing:border-box;
JS获取盒模型宽高::
1. dom.style.width/height
这种方式只能取到dom元素内联样式所设置的宽高,也就是说如果该节点的样式是在style标签中或外联的CSS文件中设置的话,通过这种方法是获取不到dom的宽高的。
2. dom.currentStyle.width/height
这种方式获取的是在页面渲染完成后的结果,就是说不管是哪种方式设置的样式,都能获取到。
但这种方式只有IE浏览器支持。
3. window.getComputedStyle(dom).width/height
这种方式的原理和2是一样的,这个可以兼容更多的浏览器,通用性好一些。
边距重叠解决方案(BFC)::
BFC:块级格式化上下文
怎么取创建bfc::
float属性不为none(脱离文档流)
position为absolute或fixed
display为inline-block,table-cell,table-caption,flex,inine-flex
overflow不为visible
应用场景::
自适应两栏布局
清除内部浮动
防止垂直margin重叠
面试
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...