1.深拷贝与浅拷贝
作者:魅眼ALong
链接:https://www.jianshu.com/p/a8dc699e9534
来源:简书
基本类型的赋值的两个变量是两个独立相互不影响的变量。
但是引用类型的赋值是传址。只是改变指针的指向,例如,也就是说引用类型的赋值是对象保存在栈中的地址的赋值,这样的话两个变量就指向同一个对象,因此两者之间操作互相有影响。
1、用 JSON.stringify 把对象转成字符串,再用 JSON.parse 把字符串转成新的对象(使用JSON)。
var obj2 = JSON.parse(JSON.stringify(obj1));
坏处:它会抛弃对象的constructor。也就是深拷贝之后,不管这个对象原来的构造函数是什么,在深拷贝之后都会变成Object。所以只适合 Number, String, Boolean, Array 的扁平对象
2、递归拷贝
function deepClone(obj) {
let objClone = Array.isArray(obj) ? [] : {};
if (obj && typeof obj === "object") {
for (key in obj) {
if (obj.hasOwnProperty(key)) {
//判断ojb子元素是否为对象,如果是,递归复制
if (obj[key] && typeof obj[key] === "object") {
objClone[key] = deepClone(obj[key]);
} else {
//如果不是,简单复制
objClone[key] = obj[key];
}
}
}
}
return objClone;
}
var obj1 = {
a: 1,
b: 2,
c: {
d: 3
}
}
var obj2 = deepClone(obj1);
obj2.a = 3;
obj2.c.d = 4;
alert(obj1.a); // 1
alert(obj2.a); // 3
alert(obj1.c.d); // 3
alert(obj2.c.d); // 4
或者使用es6中的 Object.create()方法
function deepClone(initalObj, finalObj) {
var obj = finalObj || {};
for (var i in initalObj) {
var prop = initalObj[i]; // 避免相互引用对象导致死循环,如initalObj.a = initalObj的情况
if(prop === obj) {
continue;
}
if (typeof prop === 'object') {
obj[i] = (prop.constructor === Array) ? [] : Object.create(prop);
} else {
obj[i] = prop;
}
}
return obj;
}
2.fixed本身是相对于窗口定位的,只有父级元素有transform属性时会影响它
3.vue中遇到的坑 — 变化检测问题(数组相关)
ps:数组直接赋值的话view层没有更新而打印出来的已经更新
解决方法: this.$set(array, index, value); 或者 push或pop
具体原因:https://www.cnblogs.com/zhuzhenwei918/p/6893496.html
4.vue遇到的坑—传值问题
ps:父组件在cread改变传递值a的值,在子组件mounted调用函数需用到接收值a,但接收到的a为null
解决方法:在watch里监听值的变化在调用函数
watch: {
a: {
handler(val){
if(val){
this.getCurrentVillageName(val)
}else {
this.getVillageName()
}
}
}
},
5.先选择器选择赋值input的值,如果model没有定义input的值,input将没办法改变
6.img图片会有间隙
解决办法:将img的display设置成block
7.给页面加水印,当前页面的元素点击不了
解决方法:水印的背景图加上pointer-events: none;
8.用flex的话,文本内容过大的话会压缩图片的长度
解决方法:flex-shrink: 0;
9.数字或者英文不自动换行
解决办法:word-wrap: break-word;
10.H5开发,苹果手机输入框弹出时页面被放大
解决办法:输入框的字体不要设置小于16px
详细链接:https://www.lmlphp.com/user/16871/article/item/503054/