vue3 setup语法糖

Vue 3 中新增了一种叫做 "setup" 的语法糖。它是一个全新的组件选项，可以用来替代之前版本中的 data、computed、watch 等选项。使用 setup 函数，可以让组件选项变得更简洁、更灵活。

示例：

<template>
  <div>
    <p>{{ count }}</p>
    <button @click="increment">increment</button>
  </div>
</template>

<script>
import { ref } from 'vue'

export default {
  setup() {
    const count = ref(0)
    function increment() {
      count.value++
    }
    return {
      count,
      increment
    }
  }
}
</script>

setup 函数返回一个对象，对象中的属性将会被作为该组件实例的属性，而方法将会作为该组件实例的方法

使用 setup，可以更方便的处理数据、计算属性和观察者等。