@vue/compostion-api入门
2021-02-03 本文已影响0人
桃花兰岛主
一、常用语法上的不同
1.data
image.png
2.所有的内容包在setup里面，在template使用的数据和方法需要return
image.png
二、使用组合式api的好处
1.按功能划分，便于维护
按照原来的写法，实现一个功能，我要写在不同的生命周期里面，不聚合~
image
Options API
image.png
Composition API
image.png
项目上的例子
image.png
image.png
image.png
image.png
2.逻辑复用
image.png
image
三、如何封装一个逻辑函数
其实逻辑复用函数简单理解就是 有状态的函数
比函数多了状态，比组件少了视图。
image.png
image.png
getCertificateList
image.png
useSearch
image.png
image.png
useBoolean
image.png
image.png
image.png
image.png
useAsync
image.png
image.png
库函数
1.https://github.com/vueuse/vueuse
2.https://github.com/pikax/vue-composable
3.https://github.com/dewfall123/ahooks-vue
友情链接：
1.react hooks
助力拥抱react hooks：https://zhuanlan.zhihu.com/p/103150605?utm_source=wechat_session
react hooks函数库：https://github.com/alibaba/hooks
2.composition-api
作者分享：https://github.com/Bin-FE/binfe-salon-ppt
github：https://github.com/vuejs/composition-api
官网文档：https://v3.cn.vuejs.org/guide/composition-api-introduction.html
