Vue3 笔记常用方法

nextTick

Vue.nextTick 的原理和用途

https://segmentfault.com/a/1190000012861862
https://www.cnblogs.com/blueball/p/10882043.html
https://zhuanlan.zhihu.com/p/608319606?utm_id=0

JavaScript/TypeScript中==和===的区别详解

在JS/TS项目里，除了能看到操作符来判断两个变量是否相等外，我们还会看到=操作符，这两者有什么区别吗？

先上结论，

对于String, number这些基础类型，操作符会先把两边的变量进行类型强制转换成相同的类型再比较是否相等；=操作符则不会进行类型转换，而是直接进行比较。
对于array, object这些高级类型，和 =是没有区别的，因为它们比较的是 “指针地址” 。
对于基础类型和高级类型， 和 =是有区别的；操作符会先把高级类型转换为基础类型之后，进行值的比较；=操作符则不会进行转换，类型不同，直接返回false
也就是说，==操作符只要求比较两个变量的值是否相等，===操作符则是要求两个变量的值和类型都要相同；类似地，!=操作符会去做类型强制转换，!==操作符则不会转换类型。

行标签（inline）

【html】常见的行标签（inline）、块标签（block）和行块标签（inline-block）特点及相互转换
https://blog.csdn.net/m0_50947589/article/details/124144601
行标签的特点：
1.同排序跟显示，遇到父级边界换行
2.不支持宽高，内容撑开宽高
3.不支持上下外边距
4.不正常显示上下内边距，不建议使用
5.换行被解析

块标签的特点：
在默认情况下：独占一行，默认宽度占满父级；高度为0，子级内容撑开高度。

行块标签的特点：
1.同行序跟显示，遇到父级边界换行
2.没有宽高的时候内容撑开高度
3.换行被解析

属性作用：当表格写定了宽度而内容又很多导致换行不美观时用，使用show-overflow-tooltip让文字以tooltip的形式显示。类似这样的效果

Vue中的匿名插槽与具名插槽

https://blog.csdn.net/lolhuxiaotian/article/details/121778918
https://juejin.cn/post/7244346901126414393
https://juejin.cn/post/7197970175479611451?from=search-suggest#heading-2
https://blog.csdn.net/qq_52421092/article/details/128897099

Vue 2.6.0+ 版本，使用v-slot替代slot 和 slot-scope。

注意点:
1.具名插槽的内容必须使用模板< template ></ template >包裹;
2.不指定名字的模板插入匿名插槽中，推荐使用具名插槽，方便代码追踪且直观清楚;
3.匿名插槽具有隐藏的名字"default;"

defineExpose

defineExpose --- vue通信之 子传父
https://blog.csdn.net/Realizee/article/details/131131134
https://blog.csdn.net/qq_40340943/article/details/124751773

如何使用谷歌浏览器进行 Debug 断点调试

https://blog.51cto.com/u_15105778/6083823
Debugger(调试面板)
F8 or Ctrl + : 暂停/继续
F10 or Ctrl + ': 单步执行
F11 or Ctrl +;: 单步进入
Shift + F11 or Ctrl + Shift+;: 单步退出
Ctrl +./Ctrl+, : 上一帧/下一帧(译为框架怪怪的)
Ctrl +Shift+E: 被选中代码在控制台中打印出console信息(非常实用)
Ctrl + Shift + A: 添加到debugger的watch里面,可以关注你选中内容的变化
Ctrl + B: 打断点/取消断点(很实用)

chrome://extensions/shortcuts

css justify-content属性

Vue按键修饰符：@keyup.enter

https://blog.csdn.net/a1598452168YY/article/details/127968810
@click 和 @keyup.enter不能一起使用
可以将@keyup.enter绑定到input框上
https://blog.csdn.net/qq_14993591/article/details/121097168

开发移动端，最麻烦的一点就是适配不同尺寸的屏幕

之前自适应，采用 rem / 百分比 / 媒体查询 等方式实现，现在可以采用 vm/vh 方案：

vw —— 视口的最大宽度，1vw 等于视口宽度的百分之一
vh —— 视口的最大高度，1vh 等于视口高度的百分之一

参考

https://www.jb51.net/article/240890.htm
https://blog.csdn.net/qq_51491920/article/details/126286618
https://www.fengnayun.com/news/content/211550.html
https://blog.csdn.net/weixin_53791978/article/details/131348177
https://www.runoob.com/cssref/pr-class-display.html
https://blog.csdn.net/weixin_42836226/article/details/102809084
https://geek-docs.com/css/justify-content/1_css_justify-content_property.html
https://www.runoob.com/cssref/css3-pr-align-items.html
https://zhuanlan.zhihu.com/p/376077719