[Vue教程]如何理解组件化思想

AI 概述
本章将为大家介绍 vue 的组件化思想,什么是组件化呢? 一个组件相当于是一个模块,他是独立存在于我们的 vue 应用里面的。那么,一个组件可以在 a 页面 1 上面使用,也可以在 2 页面上使用,它是可以去复用的,同样的道理在这个页面上我们也可以重复使用这个组件。然后这个组件的里面是包含整个组件要用到的业...

本章将为大家介绍 vue 的组件化思想,什么是组件化呢?

一个组件相当于是一个模块,他是独立存在于我们的 vue 应用里面的。那么,一个组件可以在 a 页面 1 上面使用,也可以在 2 页面上使用,它是可以去复用的,同样的道理在这个页面上我们也可以重复使用这个组件。然后这个组件的里面是包含整个组件要用到的业务逻辑和样式的,所以说它也是一个整体化的。

为什么要组件化?

组件化的第一个目的就是实现了模块的复用,不需要我们去把功能代码或者是业务代码重复的去编写,而且也很方便的去进行一些维护;第二个目的就是在代码的执行层面,它可以很高效的去执行 demo 的渲染;最后,就是在我们去开发一些复杂的单页面应用的时候或者是复杂的页面应用,利用组件化的思想是很方便的让我们把这种复杂的业务逻辑进行一个拆分。

如何进行拆分?

这里提供几个原则供大家参考,首先我建议大家业务代码不要超过 300 行即 300 行原则,其实也有 150 行原则,300 行原则什么意思呢,就是整个组件包括业务代码和样式尽量少一点,方便大家今后阅读。

再一个就是这个组件经常去使用,我们举个例子,比如说头部的这个导航,或者说底部的这种版权信息,还有侧边栏,这些都是我们经常要去复用的,那么像这样的模块我们就要去拆分,我们称他为复用原则。

最后就是业务复杂性原则。

当然,这种组件化模块化思想看是很美好,但也有一定的弊端,比如说组件之间的状态管理(vuex),我们这里有官方的这种工具 vuex,它会做一些状态的管理。那么多组件的混合使用,多页面这种复杂业务的怎么样去展示,怎么样去使用到那些组件,就用到了 vue-router,以及组件之间的传参、消息、事件的管理,其实都是非常复杂的,在后面的章节我会一一为大家介绍。

以上关于[Vue教程]如何理解组件化思想的文章就介绍到这了,更多相关内容请搜索码云笔记以前的文章或继续浏览下面的相关文章,希望大家以后多多支持码云笔记。

「点点赞赏,手留余香」

7

给作者打赏,鼓励TA抓紧创作!

微信微信 支付宝支付宝

还没有人赞赏,快来当第一个赞赏的人吧!

声明:本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若内容造成侵权/违法违规/事实不符,请将相关资料发送至 admin@mybj123.com 进行投诉反馈,一经查实,立即处理!
重要:如软件存在付费、会员、充值等,均属软件开发者或所属公司行为,与本站无关,网友需自行判断
码云笔记 » [Vue教程]如何理解组件化思想

1 评论

  1. 组件化开发

发表回复