Vue 3 引入了 Composition API，它提供了一种新的、更灵活的方式来组织和重用代码。在 Vue 3 中，`setup()` 函数是一个新的选项，它允许你在组件内部使用 Composition API。
下面是一个简单的 `setup()` 函数的示例：
```javascript
import { ref, reactive } from 'vue';
export default {
  setup() {
vue中reactive    // 使用 ref() 创建响应式数据
    const count = ref(0);
    // 使用 reactive() 创建响应式对象
    const state = reactive({
      message: 'Hello, Vue 3!'
    });
    // 使用 computed() 创建计算属性
    const doubled = computed(() => count.value * 2);
    // 使用 watch() 监视数据变化
    watch(count, (newValue) => {
      console.log(`Count changed to ${newValue}`);
    });
    // 使用 onMounted() 在组件挂载后执行代码
    onMounted(() => {
      console.log('Component mounted');
    });
    // 使用 onUnmounted() 在组件卸载后执行代码
    onUnmounted(() => {
      console.log('Component unmounted');
    });
    return { count, state, doubled };
  }
};
```
在 `setup()` 函数中，你可以使用各种 Composition API 的函数来创建响应式数据、对象、计算属性、监视器、生命周期钩子等。然后，你可以将这些结果返回给组件的模板中使用。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。