Vue 3.0 Function API如何颠覆前端开发，体验长尾词新特性？

本文共计2483个文字，预计阅读时间需要10分钟。

Vue官方发布了Vue 3.0的重要RFC：基于函数的组件API。同时发布了兼容Vue 2.0版本的插件vue-function-api，可用于提前体验Vue 3.0的Function-based component API。

最近 Vue 官方公布了 Vue 3.0 最重要的RFC：Function-based component API，并发布了兼容 Vue 2.0 版本的 plugin：vue-function-api，可用于提前体验 Vue 3.0 版本的 Function-based component API。笔者出于学习的目的，提前在项目中尝试了vue-function-api。

笔者计划写两篇文章，本文为笔者计划的第一篇，主要为笔者在体验 Vue Function API 的学习心得。第二篇计划写阅读vue-function-api的核心部分代码原理，包括setup、observable、lifecycle。

本文阅读时间约为15~20分钟。

概述

Vue 2.x 及以前的高阶组件的组织形式或多或少都会面临一些问题，特别是在需要处理重复逻辑的项目中，一旦开发者组织项目结构组织得不好，组件代码极有可能被人诟病为“胶水代码”。而在 Vue 2.x 及之前的版本，解决此类问题的办法大致是下面的方案：

• mixin
• 函数式组件
• slots

笔者维护的项目也需要处理大量复用逻辑，在这之前，笔者一直尝试使用mixin的方式来实现组件的复用。