基本概念
Composition API Composition API 在Vue3中的提出，实际上主要的一个亮点就是composables思想，组合式函数编程，将相关的功能代码写到同一个部分，使得代码的维护性和可读性更强。 在这里引用大帅的一个图作为展示：
从图中，可以看出来，在使用Vue2进行页面编写的时候，会将相关的功能代码分别分布到 data、methods、computed、watch这些部分中，虽然对于初学者来说，可能比较方便，因为你只需要按照这一套写下来就好，Vue2已经给你做好了约束，但是当我们开发的项目很大、功能逻辑点比较复杂的时候，假设有几千行的代码，这时候当你想去修改某个功能点的时候，你就会发现你需要不断的滑动屏幕来进行修改。
当使用 Composition API的时候，从图中可以看出，Composition API的思想是将同一个功能代码写在同一个区域里，虽然可能会过于灵活，导致初学者可能写的代码还是比较乱，但是当项目复杂起来，刚进入公司的新人也可以仿照着项目中的代码结构来进行编写，这样项目的维护性和可读性都会更好。
Vue2中代码复用和Vue3中的代码复用
在Vue2中，我们对业务代码进行功能复用时，可以使用Mixins来对某个功能进行逻辑的抽取，这样就可以实现代码功能点的划分，但是使用mixins会存在如下的缺点： 1 重名函数的风险 2 属性的来源不清晰 不知道页面中使用某个方法或是属性，是来源于哪个Mixmins文件中。
如下案例：
在这里你使用count和add方法的时候，如果有多个mixins时，则你不清楚count数据和add方法是来源于哪个minins文件中，你还需要去各个minxins文件中去进行查找，且有可能会出现多个minin文件中的数据或是方法名字相同的隐患。
在Vue3中，Composition API的提出给我们提供了另外一种解决方法，那就是自定义的hook。
案例如下：
在这里导入一个对数据进行加的功能，这时候可以通过结构的方式去获取里面对应的属性和方式，并可以对其进行重新命名，不仅解决了Vue2中的重命名的问题，且在这里可以很清楚的看清数据或是方法的来源。
