Vue 3.x 的 script setup 语法糖用法详解

由于原来vue3中的setup Composition API 语法太过于冗长麻烦，官方又出了这么个语法糖，非常的好用了。
这里介绍一些常用的语法：
一、如何开始使用？
1、需要关闭vetur插件，安装Volar插件
2、tsconfig.json / jsconfig.json 文件 ，在compilerOptions里面加上 "strict": true，和 "moduleResolution": "node"
3、直接在script标签加入setup 或者 setup lang="ts"

或者

script setup里面的代码会被编译成组件setup()函数的内容。这意味着与普通的 script 只在组件被首次引入的时候执行一次不同，script setup 中的代码会在每次组件实例被创建的时候执行。
当使用 script setup 的时候，任何在script setup声明的顶层的绑定 (包括变量，函数声明，以及 import 引入的组件、方法等内容) 都能在模板中直接使用
import 导入的内容也会以同样的方式暴露。意味着可以在模板表达式中直接使用导入的函数，并不需要通过 methods
script-setup 无法指定当前组件的名字，所以使用的时候以文件名为主

更新中。。。