前端框架-组件分类

  |  
 阅读次数

组件通信精髓归纳

组件分类

常规页面

每个页面(.vue) 即是一个组件

功能性抽象组件

不包含业务,独立、具体的功能组件,button,select、date、alert、dialog、modal。。。

业务组件

在业务中被多个页面复用

它不像第二类独立组件只包含某个功能,而是在业务中被多个页面复用的,它与独立组件的区别是,业务组件只在当前项目中会用到,不具有通用性,而且会包含一些业务,比如数据请求;而独立组件不含业务,在任何项目中都可以使用,功能单一,比如一个具有数据校验功能的输入框。

组件关系

父子组件

兄弟组件

跨级组件

在父子关系中,中间跨了很多个层级。

组件构成

一个再复杂的组件,都是由三部分组成的: prop、 event、 slot,它们构成了 Vue.js 组件的 API。

属性 prop

插槽 slot

自定义事件 event

两种写法:

1、在组件内部自定义事件 event

组件通信

ref和$parent和$children