console

其实vue3内部实现了一个initCustomFormatter 让我们在开发模式下更加直观美化的展示我们打印的东西

比如打印一个ref对象

未开启功能前

像我这个强迫症，我是一定会把那个未展开的value点一下的😄

开启后

非常直观，知道是一个ref，然后值是1

一般情况下，我们只关心这个ref的value，而不关心他身上的一些其他标识，比如上面的__v_isRef 、__v_isShallowReactiveFlags；这两个标识分别是

• 是否为ref对象
• 是否为浅层代理

_rawValue: 原始数据

开启美化方法

摘录来自Vue.js设计与实现 霍春阳（HcySunYang）

“以 Chrome 为例，我们可以打开 DevTools 的设置，然后勾选“Console”→“Enable custom formatters”选项”

然后刷新即可使用😎