Composition API RFC：Vue 的下一步

这周 Vue 官方放出了 Composition API 的 RFC（征求意见稿），社区吵翻了天。认真读完文档，说说它到底要解决什么问题。

Options API 的痛点

同一个功能（如"鼠标位置追踪"）的代码被打散在 data、methods、mounted、beforeDestroy 四处。组件一大，想理解一个功能要在选项之间来回跳。

更大的问题是逻辑复用：mixin 是目前的复用手段，但缺点明显——

• 多个 mixin 的数据来源不清，模板里一个变量不知道谁注入的
• mixin 之间可能命名冲突
• 类型推导困难，TS 支持差

新 API 长什么样

// 一个功能的所有逻辑收敛在一起，还能抽成独立函数复用
function useMouse() {
  const x = ref(0)
  const y = ref(0)
  const update = (e) => { x.value = e.clientX; y.value = e.clientY }
  onMounted(() => window.addEventListener('mousemove', update))
  onUnmounted(() => window.removeEventListener('mousemove', update))
  return { x, y }
}

export default {
  setup() { // 新的组件选项
    const { x, y } = useMouse() // 组合任意功能，来源清清楚楚
    return { x, y }
  },
}

核心 API：ref（包装值类型）、reactive（对象响应式）、computed、生命周期的 onXxx 写法。

我的看法

"什么都写在 setup 里会不会更乱"是最多的质疑，但新 API 是可选的——简单组件继续用 Options API，复杂逻辑才组合。这不是推翻，是给大项目一条出路。

按 RFC 的计划，它会随 Vue 3 正式落地。准备跟进了。