Vue3对组合式API的理解

组合式API

这个概念是在Vue3.0引出的，在Vue2.0中以及更早的版本我们都使用选项式API.但是你知道嘛，它有很多不足和令人烦恼的地方。

对于在大学写了2年vue代码的人，我总结出vue2的以下不足：

• 业务代码分散在选项中，不方便维护和管理
• 选项代码冗长，不方便查看等

针对第一个，你可以想一下，我们一个vue组件可能涉及多个业务逻辑，比如收藏、点赞、关注等。

那这些你平时写的时候一般都是data中定义一些初始化数据，method里在写一些方法，在watch监听一下数据变化。那这样的话是不是说我们的业务是不是分散到各个option这个选项中了。那么日后你想修改代码或者添加某个逻辑的功能时候，是不是找起来代码非常的累（因为很零散）

于是Vue3提出了组合式API的概念，这个概念很好的解决了上面两个问题。可以使得我们的业务逻辑变得集中化、模块化。而不是分散在各个options（data、methods、create、mounted、watch、computed）中

下面请看这个图：（相同业务逻辑，是相同的颜色）

我们清晰的看到，组合式API真的可以把分散在data、methods、computed、watch里的逻辑变得集中化模块化

当然我们也可以对集中的模块进行封装化管理，也就是业务抽离，单独建立一个文件夹新建js去写导出模块，然后在需要使用的地方进行导入。这样以后你修改业务逻辑，增加功能时候，就只需要在对应模块进行修改就好了

直到现在我还是一名大学生，热爱前端，热爱生活，更喜欢和大家交流知识。如果有理解不妥当的地方，还请批评指正