组件化和模块化的区别|学习笔记

简介: 快速学习组件化和模块化的区别

开发者学堂课程【Vue.js 入门与实战组件化和模块化的区别】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址https://developer.aliyun.com/learning/course/586/detail/8173


组件化和模块化的区别


内容介绍:

一、 组件的定义

二、 组件化和模块化的不同

 

一、组件的定义:

组建的出现就是为了拆分 vue 实例的代码量的,能够让我们以不同的组件来划分不同的功能模块,将来我们需要什么样的功能就可以去调用对应的组件即可。

 

二、组件化和模块化的不同:

1.模块化:

是从代码逻辑的角度进行划分的;方便代码分层开发,保证每个功能模块的职能单一。

2.组件化:

是从 UI 界面的角度进行划分的;前端的组件化,方便 UI 组件的重用。

如 none 这一代码就是利用模块化

3. 举例:

比如说百度首页,点开之后,每一个小图标都有一个 titled,有一个关闭按钮。每一个小对象,都有相映的图标,我们只需要把唯一的一个组件把标题,把图标放进来,我们就可以渲染对应的一个小方块,这就是组件化。后面的搜索框也是一个组件,这就是我们从 UI 的角度,分成几个小部分。

相关文章
|
2月前
|
前端开发 JavaScript 物联网
组件化设计适用于哪些场景
【10月更文挑战第22天】组件化设计适用于哪些场景
|
2月前
|
前端开发 JavaScript UED
什么是组件化设计
【10月更文挑战第22天】什么是组件化设计
|
3月前
|
前端开发 JavaScript 开发者
深入解析前端开发中的模块化与组件化实践
【10月更文挑战第5天】深入解析前端开发中的模块化与组件化实践
38 1
|
5月前
|
前端开发 UED
组件化的好处是什么
【8月更文挑战第13天】组件化的好处是什么
148 1
|
8月前
|
JavaScript 前端开发
面试题:组件化和模块化的理解
面试题:组件化和模块化的理解
72 0
|
8月前
|
存储 JavaScript 前端开发
第四章 模块和组件、模块化和组件化的理解
第四章 模块和组件、模块化和组件化的理解
|
8月前
|
缓存 JSON 前端开发
前端模块化的前世今生(上)
前端模块化的前世今生(上)
119 0
|
8月前
|
自然语言处理 JavaScript 前端开发
前端模块化的前世今生(下)
前端模块化的前世今生(下)
|
缓存 JavaScript 前端开发
前端模块化 #116
前端模块化 #116
115 0
|
前端开发 JavaScript 持续交付
谈谈对前端组件化,模块化,工程化的理解
谈谈对前端组件化,模块化,工程化的理解
28628 5
谈谈对前端组件化,模块化,工程化的理解