我是靠谱客的博主 鳗鱼雨,最近开发中收集的这篇文章主要介绍vue3中 如何使用组合式API拆分业务功能,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

 1. 基于业务逻辑的拆分拆分的是什么?
         拆分的是独立的业务逻辑 (js代码)

2. 基于组件的拆分逻辑拆分的是什么?
        拆分的是一个vue实例对象 (html + js + css)

3. 业务逻辑拆分 vs 组件拆分
        组件拆分:1. 复用  2. 减少维护成本(很有可能出现因为组件拆分必定会形成组件嵌套 组件通信 通信成本)
        逻辑拆分:1. 复用 只有js 没有组件通信的问题 (既可以进行复用 又不会造成组件通信成本的增加)

4. 逻辑拆分怎么做呢?
        1. 单独定义一个js文件 useXXX.js
             function useXXX(){
               // 业务逻辑代码
               return {
                 响应式数据
                 事件回调函数
               }
             }
        2. 来到.vue文件中 setup函数执行useXXX函数
             const { 响应式数据,事件回调函数 } = useXXX()
             return {
               响应式数据,
               事件回调函数
             }

5. vue3 setup函数到底是干嘛的?
        setup函数中尽量不要编写太多的业务代码 它只是一个组合函数
        用来把拆分出去的业务逻辑在这里组合起来 供模板使用

最后

以上就是鳗鱼雨为你收集整理的vue3中 如何使用组合式API拆分业务功能的全部内容,希望文章能够帮你解决vue3中 如何使用组合式API拆分业务功能所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(53)

评论列表共有 0 条评论

立即
投稿
返回
顶部