文章目录
该篇文章为总结,比较杂乱,不好分类,有缘人见,哈哈哈!
css变量的定义和使用
也可以直接使用scss/less
函数调用原理
这里可以看看浏览器的运行过程:
2021/9/22补充(同步异步,堆栈)
离谱,这个文章不仅是和读者有缘相见,和我都是有缘相见,今天想起来这个图,感觉解释不深,准备重新来写写,硬是找了我一个小时才找到这个图在这里!
大致就是,浏览器是顺序执行的,直到遇见异步函数,异步函数有结果后,将执行的操作传给回调队列,然后等主线程空闲了,再将回调函数交给函数调用栈进行处理,回归顺序执行!
验证代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
<script>
setTimeout(function(){
console.log("-------")
},1);
for(let i = 0;i<10000;i++){
console.log("111")
};
setTimeout(function(){
console.log("+++++")
},1);
for(let i = 0;i<200;i++){
console.log("222");
}
</script>
</html>
运行结果:
发现虽然只setTimeout了1毫秒,但是只有当顺序执行全部执行完之后才会执行里面的函数!
vue的scoped
better-scroll的click属性
防抖和节流
node版本的意思
混入mixin
创建了还要导出,如上!
$ refs中$el的意思
offsetTop不准是为什么
这里补充一个js:
Element. scrollIntoView()
这个的作用是:滚动到目标元素的位置
element.scrollIntoView(true); // 滚动到目标元素顶部
element.scrollIntoView(false); // 滚动到目标元素底部
监听图片加载完成
postcss-px-to-viewport配置补充(适配)
配置详情见:https://github.com/pbw-langwang/VueDirectorySpecification-mall
还有另外的px转rem的办法 postcss-px2rem,可以参考这个博客:
1、vue-cli3中PC端大屏自适应
2、使用px2rem不生效
@import简化link
flex布局的研究
注意:是裁剪
vue适配思路
px转化rem工具可以使用postcss-px2rem,参考:vue-cli3中PC端大屏自适应