vue3.0

vue3更快


1表示动态文本变化。2表示clss变化等等。

Vite

ref

方法里面的count是一个对象，

reactive

点谁删谁，

解决vu2.x的问题，将数据逻辑绑定在一起

将业务逻辑绑在一起，

定义一个函数然后再在setup里面印入。记得在setup里面也要进行导出。

将删和加的功能，分别放在一个函数里，业务逻辑并不捆绑。


再进行封装再导出，优雅永不过时。

Composition API(vue3) &&Option Api(vue2)

可以结合使用。
composition的本质：通过return暴露出来的属性会被注入到data里面去，方法会被注入到methods里面去，这就是注入api的本质。

setup执行时机

在beforecreate之前执行。表示她不能使用data里面的值和methods的方法。

vue2生命周期

reactive本质

reactive只能给对象或数组，如果传递其他值，不能达到响应式。

只有当是数组或者对象时，才能进行响应式。默认是arr或者json,若传递了date()等对象，界面不会更新，像更新就得重新赋值。

ref理解

所以修改的时候必须用age.value来修改

两者的区别

通过reactive去创建的age，在模板上vue不会帮你加上value，得自己加。

通过是否拥有__v_isref来判断是ref还是reactive

递归监听r

ref和reactive都会监听每一层的变化并把它们包装

非递归监听

通过showRef,showReactive声明的数据只会包装第一层，若第一层不变，下面的也不改变。
注意showRef监听到的是.value的值，而不是.value.a里面的值，故.value不改变，下面的值也不改变。

若只想修改第四层的数据，可以通过triggerRef将值重新渲染一下、

创建环境

或者通过vue-ui去创建项目

建议安装两个插件 eslint(格式) vetur(引导)