1、使用vue的过程中,尝试使用js数组之间传值,发现改变一个数组以后,原始的数组也发生了变化。
原来:两个数组的地址因为完全赋值变成了同一个,所以一个产生变化会对另一个也造成影响
解决:通过百度搜索发现可以通过JSON.parse(JSON.stringify(数组))来解决
原理:使用了stringify转化成了string后原先的地址消失,然后使用parse重新格式化就成了一个新的数组了
2、开发的项目中突然发现:项目中使用padding会对元素的宽高造成影响。因为希望能够不影响元素,所以去找了办法:设置 box-sizing: border-box;
原因:造成padding影响盒子的width或者height的原因是我们在设置css样式的时候给定了width或height,如果未设置,就不会受到padding的影响
3、设置文字超过两行隐藏省略的办法:
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
4、box-shadow覆盖问题:在开发中设置阴影如果下方拼接的是其他组件,并且设置了背景,那么阴影就会被覆盖
原因:因为组件的层级高覆盖了阴影
解决:设置position:relative;z-index:100;提高元素层级
5、关于父子组件传值问题:
如果单纯只是在子组件进行使用父组件的传值(比如:展示信息、跳转地址),那么子组件可以直接this. prop中的元素;
如果你想要修改父组件的传值,那么你就要在data中声明一个新的元素在mounted中进行赋值操作
如果你想要动态的在父子组件传值: 父传子---在子组件watch监听prop中的元素然后赋值; 子传父:emit方法,这个不用多说了
6、关于多图片上传的实现:
(1)、本身不追求实现效果,只是为了多图片上传:
可以使用原生的input,它的属性accept 以及 multiple 可以控制文件上传的类型以及数量大小,但是类型控制不严谨,需要配合js使用
(2)、有实现效果要求
可以使用自己的布局,然后隐藏input,使用伪触发的形式,获取文件后回填url路径展示
----待增加