Ref & Reactive

能用 Ref 就尽量用

• Ref：
  • Pros： 显示调用 + 类型检查
  • Cons：.value
• Reactive：
  • Pros：自动 Unwrap
  • Cons：在类型上和一般对象没有区别 + ES6解构会失去响应性(toRefs) + 使用watch需要用箭头函数包装

Ref 自动解包

• watch 直接接受 Ref 作为监听对象，回调中为解包后的值

  1 2 3 4

  const counter = ref(0) watch(counter, count => { console.log(count); // same as `counter.value` })

git配置多个ssh key

解决方案

1

# todo

光标移动

整体移动一行

• Option + 上/下

下一个单词

• Option + 左/右

删除一个单词

• Option + Delete

删除一行

• 直接剪切掉：Command + x
• 删除：Command + Shift + K

批量操作

批量选择

• Command + D

批量复制光标以添加内容

• Control + Option + 上/下

批量替换当前文件中所有匹配的文本

• Command + F2

激活/聚焦

全局查找时逐项查看

• F4

下一个Terminal / 下一个编辑器 Tab页

• Option + Command + 左/右

Error: listen EADDRNOTAVAIL

问题现象

解决方案

• 原因：SwitchHosts设置的IP地址出错

1. 查看本机ip地址

1

ifconfig | grep "inet " | grep -v 127.0.0.1

2. 更改SwitchHosts的localhost ip设置

查看当前源

1

npm config get registry

切换源

1. 官方源

   1	npm config set registry https://registry.npmjs.org/

number类型初始值为空的参数

问题现象

解决方案

1. 把number类型的初始值设为 可选
2. 不赋初值，后续也可以添加

watch ref的值 / 地址

问题现象

• watch 的 ref 值不加 .value 只是地址，加 .value 可以watch到值的变化。

解决方案

1
2
3
4
5
6

const timeRange = ref([])
watch(() => timeRange.value, () => {
  [searchParams.createStartTime, searchParams.createEndTime] = timeRange.value
  resetPageSetting()
  debounceChange()
})

node版本切换

解决方案

1
2
3
4
5
6

arch -x86_64 zsh
source $(brew --prefix nvm)/nvm.sh
nvm use v12

// 查看现在node版本
nvm current node -v

LocalStorage & SessionStorage

• 刷新当前页面，或者通过location.href、window.open、或者通过带target="_blank"的a标签打开新标签，会把旧窗口（或标签）的sessionStorage数据带过去.
  • 但从此之后，新窗口（或标签）的sessionStorage的增删改和旧窗口已经没有关系了。
  • 如果只是在当前标签内跳转新页面（或者刷新），数据还会保留（前提当然是同域）。
• 但是如果是主动打开一个新窗口或者新标签，那就没有sessionStorage。

∴ sessionStorage的session仅限当前标签页或者当前标签页打开的新标签页。通过其它方式新开的窗口或标签不认为是同一个session

浏览器 进程 / 线程

• 进程：一个网页就是一个进程
• 线程：
  1. 类别A：GUI 渲染线程 （与主线程互斥）
  2. 类别B：JS 引擎线程 （主线程）
  3. 类别C：EventLoop轮询处理线程
  4. 类别D：其他线程，有 定时器触发线程 (setTimeout)、http 异步线程、浏览器事件线程 (onclick)等等。

线程