2022/01/10

关于块格式化上下文：https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Block_formatting_context
BFC：浮动元素和其它元素交互的区域。
(BFC会让父元素内部高度为0，注意，是让父元素，一整个的，高度为0）
看链接讲得很清楚了，但是怕我忘记了，所以简单说一下，
像 < div > < div1 > < div2 > < div >
div1和div2被包在div里，此时给div1设置float:left，就会产生BFC，在BFC的定义里，其它元素
指的就是div2,那么它们交互的区域就是div，所以此时需要给div设置一个样式值。比如 display:flow-root;

！！关于BFC为什么可以清除浮动：https://zhuanlan.zhihu.com/p/25321647
因为浮动是半脱离文档流的，而一旦脱离文档流，它的后继元素就要被迫接受它，也就是说，浮动元素会影响后继元素，占据后继元素的空间。这句话的意思就是说我们的后继元素因为以上的现象没有“私人空间”了，BFC的出现正好能给后继元素“私人空间”，使得浮动元素无法影响它。这里给后继元素设置私人空间的办法是对后继元素设置样式overflow:hidden.

关于盒子模型，margin可以设置元素的位置而且它是透明的占空间的。
三栏布局：
案例：https://www.cnblogs.com/webtaotao/p/11031723.html
float:
比如说链接里浮动元素，中间那个center元素设置了margin。通过float和中间元素设置margin_left,
margin-right实现了三栏布局。
position:
父元素设置relative,子元素都设置absolute。
flex:
父元素设置display:flex.

左边定宽，右边自适应：
案例：https://www.cnblogs.com/ypppt/p/13050766.html
其实跟三栏布局很像的。

em,rem,vw,vh:https://blog.csdn.net/javaloveiphone/article/details/51120476
这个链接不错的因为有效果显示,讲得也很好
r是root，根的意思，所以rem是相对于html根元素的大小。
v是view,w是width,h是height，所以1vh 等于1/100的视口高度，1vw 等于1/100的视口宽度。

绝对居中：用的absolute知识。

margin-left：-50px 代表盒子“向”左移动50px。可以这样理解：设置margin-left:50px的时候盒子
会怎么样？当再给盒子设置margin-left:-20px的时候，是不是就等于margin-left:30px;
30px和50px的盒子在哪个位置呢？就知道设置负值会怎么样了。

当盒子没有固定宽高的时候就用transform:translate(-50%,-50%)

display:flex justify-content:center align-items:center

之前说过javascript声明的变量提升，仅针对于var
像let,const都没有变量提升。
let还有块级作用域。
let声明前不可以进行赋值——暂时性死区。
不可以重复声明
let 和 const 声明的变量不会挂在全局window对象上面。
const声明必须立马赋值。

class和function：都可以做构造函数，但是class不可以通过call,apply,bind改变执行上下文。

vue3.0 用的是element plus

9-12 实现上传文件业务

koaBody设置：

multipart:true 支持文件上传
formidable:{
maxFileSize:20010241024
} ----设置文件尺寸大小

取文件名后缀的方式：

filename.split(“.”).pop()

${变量名}

9-15 二级目录自动展开

10-2 注册阿里云账号与购买云服务器。

关于购买云服务器，比如阿里云，腾讯云，安装了以后软件就有了操作系统，可以设置windows,linux等
版本。这样自己的软件就可以在这些操作系统上使用了。
这个服务端就跟电脑桌面一样，放置上软件和代码。

这个代码是怎么样的呢？首先在fe路径下： npm run build, 打包出现dist目录。
npm run build : 把项目交给webpack,做一些打包，切割，配合一些插件loader的处理。
怎么运行dist? cd dist，输入 live-server ,会自动进入页面。
live-server源于 npm run live-server
其次在be目录下 npm i koa-static
在be/src/index.js中记得引入koa-static
在be目录下创建public，把fe/dist里面的内容复制到be的public下，
把该路径传递给koaStatic.
也就是说 app.use(koaStatic(path.resolve(_dirname,‘…/public’)))
这句话的作用就是把指定的路径作为静态资源给浏览器访问。

现在这套代码就可以部署到线上了。直接管be就好了，因为fe已经在be的public下了。
（fe/dist - - > be/public ,且 app.use(koaStatic(path.resolve(_dirname,‘…/public’))))，所以
不用理fe！！把be除掉node_modules后进行压缩。（重改：不需要除掉node_modules)

在该部署服务器下跑起来就好了，这样其它电脑通过服务器地址+端口地址就可以访问到我们自己写的
网站了。

之前的：默认值是组件内props配置项配置的，simple是 :simple=“true” 的简写。

10-5 安装centos
centos是linux的发行版本。

es6知识：
map是一个有两个元素的二维数组。const map = new Map([ [‘foo’, ‘bar’], [‘baz’, 42] ])
两个元素是键值对。
之前学过map怎么转换为对象： var obj = {} for ( let [ key ,value] of map) { obj[key]=value}
确实是[key,value]，因为Map就是长这样的：([ [‘foo’, ‘bar’], [‘baz’, 42] ])
现在map转化成对象又有一个，Object.fromEntries(map)
可以看链接：https://www.xuekai.cloud/2021/09/06/JavaScript%E4%B9%8BObject%E6%96%B9%E6%B3%95%E5%B1%9E%E6%80%A7/#:~:text=Object.isFrozen%20%28%29%20%E6%96%B9%E6%B3%95%E7%94%A8%E4%BA%8E%E5%88%A4%E6%96%AD%E4%B8%80%E4%B8%AA%E5%AF%B9%E8%B1%A1%E6%98%AF%E5%90%A6%E8%A2%AB%E5%86%BB%E7%BB%93%EF%BC%8C%E8%BF%94%E5%9B%9E%E5%B8%83%E5%B0%94%E5%80%BC%E3%80%82%20%E4%B8%80%E4%B8%AA%E5%AF%B9%E8%B1%A1%E6%98%AF%E5%86%BB%E7%BB%93%E7%9A%84%E6%98%AF%E6%8C%87%E5%AE%83%E4%B8%8D%E5%8F%AF%E6%89%A9%E5%B1%95%EF%BC%8C%E6%89%80%E6%9C%89%E5%B1%9E%E6%80%A7%E9%83%BD%E6%98%AF%E4%B8%8D%E5%8F%AF%E9%85%8D%E7%BD%AE%E7%9A%84%EF%BC%8C%E4%B8%94%E6%89%80%E6%9C%89%E6%95%B0%E6%8D%AE%E5%B1%9E%E6%80%A7%EF%BC%88%E5%8D%B3%E6%B2%A1%E6%9C%89,getter%20%E6%88%96%E8%80%85%20setter%20%E7%BB%84%E4%BB%B6%E7%9A%84%E8%AE%BF%E9%97%AE%E5%99%A8%E7%9A%84%E5%B1%9E%E6%80%A7%EF%BC%89%E9%83%BD%E6%98%AF%E4%B8%8D%E5%8F%AF%E5%86%99%E7%9A%84%E3%80%82
需知：map长什么样，map怎么转换成对象。

虽然NaN == NaN 结果为false,但是Object.is()返回的结果却是true.

使用node.js进行简单抓包：https://www.cnblogs.com/it-xiong/p/11396019.html
这样可以拿到想要的数据就不用自己去编了。