Vue 3 组合式 API 实战

组合式 API 是 Vue 3 的核心特性，它解决了 Options API 中逻辑分散的问题。

一、setup 与 ref

<script setup>
import { ref, computed } from 'vue';

const count = ref(0);
const double = computed(() => count.value * 2);
</script>

二、生命周期与侦听

import { onMounted, watch } from 'vue';

onMounted(() => fetchData());
watch(count, (v) => console.log('count 变化:', v));

三、逻辑复用

将可复用逻辑抽取为 composable 函数，实现真正的模块化。