总结一下疫情期间在家学习的笔记
程序员文章站
2022-07-14 12:42:42
...
先来一段自白:
- 还是在学vue,这次从头开始学的,学习进度有点慢,喜欢走神扣手机。。。难受!!!
- 年前公司就在做前后端分离(mysql+springboot+springcloud+vue),从数据库到接口再到页面都自己写(缺人的原因),感觉自己已经会vue了,但这次重新学习,发现有很多小知识点都没听说过,所以又发现自己好菜了。。。
- 感觉程序员就是在学会与不会之间来回徘徊,当一个技术你会了用了的时候发现自己好牛x,啥都会了,再用用又发现自己啥都不会
开始总结,东西很多很琐碎,归类也不是很好归
1. css相关
样式这个东西个人平常写的少,写的时候边调试边改,还是相当磨人的
div水平均分排列相关(div默认浮动是垂直的):
display: flex;//div默认是竖向排列,设置后成横向排列
flex: 1;//均分上面横向排列的div
flex-wrap: wrap;//均分横向排列后,超过一定大小时换行
justify-content: space-around; //均分横向排列后,超过一定大小时换行,并把这行多余的空白部分均分填充,两边也有空白。如下图1-1:
justify-content: space-between; //均分横向排列后,超过一定大小时换行,并把这行多余的空白部分均分填充,两边没有空白,空白全在中间。如下图1-2:
justify-content: space-evenly可以使每个元素之间和元素距离边距的距离都相等,但是兼容性比较差(iphone的SE上不支持,会失效,相当于没有设置),space-evenly将剩余空间平均分割,例如有5个元素,这样就有6个相同宽度的间隔空间,间隔空间的数量等于元素的数量加一。如下图1-3
定位相关,position我之前用的都是absolute和relative比较多,再补充三个(最后一个对浏览器版本有要求好像):
Position属性四个值:static、fixed、absolute和relative的区别和用法
先看下各个属性值的定义:
1、static(静态定位):默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。
2、relative(相对定位):生成相对定位的元素,通过top,bottom,left,right的设置相对于其正常(原先本身)位置进行定位。可通过z-index进行层次分级。
3、absolute(绝对定位):生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级。
4、fixed(固定定位):生成绝对定位的元素,相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级
5、当超过一定像素后,设置为固定定位fixed。比如,超过44px时设置为固定定位:
position: sticky;
top: 44px;
2. js相关
关于json。这个真的是之前不知道这种用法,之前公司有个需求就是json数据,然后json.变量取值,我还在那遍历变量,存到一个新的数组转来转去
1.json格式的数据,点方法后面跟的必须是一个指定的属性名称(如:data.name),
而中括号方法里面可以是变量比如字符串。(如:data["Eric"])
eg:
var haha = "name";
console.log(obj.haha); // undefined
console.log(obj[haha]); // cedric
2.中括号方法里面的属性名可以是数字,而点方法后面的属性名不可以是数字
3.当动态为对象添加属性时,必须使用中括号[],不可用点方法
关于数组(应该是es6的语法,以前也没用过这种)。需求:把数组B的元素放在数组A里面,且数组A之前的元素不被覆盖
一、在vue种响应式的写法
除遍历后挨个push还有一个语法糖:…数组名如下图2-1
二、非响应式的写法:
concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本
var a = [1,2,3];
document.write(a.concat(4,5));//输出:1,2,3,4,5,数组a还是[1,2,3]
3. 。未完待续
4. 。
5. 。
6. 。
7. 。
8. 。
9. 。
推荐阅读