携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第13天,点击查看活动详情 >>
[技术使用点]
[一、mixins的特点]
- 方法和参数在各组件中不共享,虽然组件调用了mixins并将其属性合并到自身组件中来了,但是其属性只会被当前组件所识别并不会被共享,也就是其他组件无法从当前组件中获取到mixins中的数据和方法。
- 引入mixins后组件会对其进行合并,将mixins中的数据和方法拓展到当前组件中来,在合并的过程中会出现冲突,接下来我们详细了解Mixins合并冲突
[Mixins合并冲突]
- 值为对象(components、methods 、computed、data)的选项,混入组件时选项会被合并,键冲突时优先组件,组件中的键会覆盖混入对象的
- 值为函数(created、mounted)的选项,混入组件时选项会被合并调用,混合对象里的钩子函数在组件里的钩子函数之前调用
[与vuex的区别]
vuex:用来做状态管理的,里面定义的变量在每个组件中均可以使用和修改,在任一组件中修改此变量的值之后,其他组件中此变量的值也会随之修改。
Mixins:可以定义共用的变量,在每个组件中使用,引入组件中之后,各个变量是相互独立的,值的修改在组件中不会相互影响。
[与公共组件的区别]
组件:在父组件中引入组件,相当于在父组件中给出一片独立的空间供子组件使用,然后根据props来传值,但本质上两者是相对独立的。
Mixins:则是在引入组件之后与组件中的对象和方法进行合并,相当于扩展了父组件的对象与方法,可以理解为形成了一个新的组件。
[组件开发难点]
- 高内聚低耦合
在软件时代,开发应用有两个重要的原则:高内聚和低耦合。
所谓高内聚是指一个软件模块是由相关性很强的代码组成,只负责一项任务,也就是常说的单一责任原则。所谓低耦合是指一个完整的系统,模块与模块之间,尽可能的使其独立存在,减少不同功能或模块之间紧密关系。高内聚和低耦合可以保证服务的独立性以及系统的灵活度,而组件化的思想正是该原则的体现。
组件化的思想关键也是使得某个功能独立化,不会影响其他组件。比如组装电脑,由不同的组件构成,例如显示器,显卡,cpu,风扇,硬盘等,即使其中的某个部件出了问题,也不会影响其他的部件,不仅如此,我们还能快速地确认电脑出现问题的部件,除此之外,我们还可以对电脑的某一部件进行配置升级。同理,我们也可以通过更换修改组件来进行软件应用的功能拓展。
- 最大限度的简化使用配置
举一个在开发blendPageForm组件时相关配置的变化,在这个功能上是需要实现的是表单中动态联动表格和相关formItem。通过对比,很明显最终版给使用者的体验感会更好!
第一版blendPageForm的相关配置