Vue3.2的setup语法糖

1、基本使用

在vue3.2中我们不再需要进行return，当使用 <script setup> 的时候，任何在 <script setup> 声明的顶层的绑定 (包括声明的变量，函数声明，以及 import 引入的内容) 都可以在模板中直接使用，这是因为在setup函数中，所有的ES模板都被认为是暴露給上下文的值，并包含在setup()返回对象中。

 

这里面的代码会被编译成组件 setup() 函数的内容，这也就意味着与普通的 <script> 只在组件被首次引入的时候仅执行一次不同，<script setup> 中的代码会在每次组件实例被创建的时候执行。这一点非常的重要，也就是写在 <script setup> 中的代码，例如初始化的赋值等在组件每次实例创建时都重新执行一次。

自动注册

 使用3.2的语法时，如果需要像之前一样去引入其他组件，就无需再通过components进行注册，我们可以直接引入使用。示列：

<template>
  <subassembly @getChili="getChili" :title="msg" />