vue3中的setup语法糖

在Vue 3中，`setup`函数是一个新的语法糖，用于替代Vue 2中的`beforeCreate`和`created`生命周期钩子函数。它是组件的入口点，负责初始化组件的状态、数据和方法。

`setup`函数接收两个参数：`props`和`context`。`props`是组件的属性对象，可以通过解构赋值的方式获取其中的属性值。`context`是一个包含了一些常用API的对象，例如`attrs`、`slots`、`emit`等。

在`setup`函数中，你可以执行以下操作：
1. 返回一个响应式的数据对象，这些数据将会被注入到组件中。
2. 返回一个渲染函数，用于自定义组件的渲染逻辑。
3. 执行一些副作用操作，例如订阅事件、发送请求等。

下面是一个简单的示例：

import { ref } from 'vue';

export default {
  setup(props, context) {
    // 响应式数据
    const count = ref(0);

    // 自定义渲染逻辑
    const increase = () => {
      count.value++;
    };

    // 副作用操作
    context.onMounted(() => {
      console.log('组件已挂载');
    });

    return {
      count,
      increase
    };
  }
};