Vue — 组件种类与组件组成

[TOC] >[success] # 组件种类 ~~~ 1.这个问题的来源是我第一使用vue-cli 搭建项目的时候产生的，某天公司一个 开发人员问我，我的项目结构规划的时候，我提到了视图组件，公司同事立刻 反问我视图组件和组件有什么区别 ，当时我懵了一段时间。根据cli为我们规 划的项目目录，我们也可以发现官方很明确的将组价分别放到了'views' 文件 件中和'components' 文件中，但两者都是组件区别在哪里？ 2.这篇文章是根据'Aresn' 大神在掘金发布的文章，我个人理解。重新再次整 理的内容，如果你的资金允许特别推荐购买这个大神的小册，准确的说我的 vue除了官方文档，和一些视频教程外，让我进步最快的就是'iview' 几位作者将自己vue文章分享出来，让我这个刚刚接触vue的人可以进步飞快， 在这里还要强推iview另一个作者'lison' 大神 ~~~ 文章来自AresnTalkingData 前端架构师，iView 作者 发布在掘金网小册中内容启发整理 >[danger] ##### 组件种类 ~~~ 1.简单的说vue项目中的组件分为三种'视图组件'，'基础组件','业务组件' 2.什么是视图组件：由 vue-router 产生的每个页面主要承载当前页面的 HTML 结构，会包含数据获取、数据整理、数据可视化等常规业务。整个文 件相对较大，但一般不会有 props 选项和 自定义事件，因为它作为路由的渲 染，不会被复用，因此也不会对外提供接口。这类组件主要是根据还原设计 稿，完成需求 2.基础组件:不包含业务，独立、如日期选择器、模态框等。这类组件作为项 目的基础控件，会被大量使用，因此组件的 API 进行过高强度的抽象，可以 通过不同配置实现不同的功能,开发难度要高于第一类组件，因为它的侧重点 是 API 的设计、兼容性、性能、以及复杂的功能。这类组件对 JavaScript 的编程能力有一定要求 3.业务组件:在业务中被多个页面复用的，它与独立组件的区别是，业务组件 只在当前项目中会用到，不具有通用性，而且会包含一些业务，比如数据请 求；而独立组件不含业务，在任何项目中都可以使用，功能单一，比如一个 具有数据校验功能的输入框。也可以对现阶段的一些流行js库进行二次封装 成vue组件 ~~~ >[danger] ##### 组件的组成 [文章参考即刻时间一点资讯开发唐金州](https://time.geekbang.org/course/detail/163-86426) ~~~ 1.随着组件的深入，大体可以发现组件是属性、事件、插槽的组成体，属性其实 vue详细划分了三个部分，分别是自定义属性'props'、'原生属性attrs'、'特殊属性class/style' 2.具体案例可以看下一章节 ~~~