码良组件封装详解
最近码良迎来了一波新功能的上线，并毫无保留地继续进行了代码开源-赶忙star关注 。新上线的功能有桌面端页面制做、”楼层模式“、”正宗“布局组件（容器组件）的开发能力、组件封装、word 文档解析、psd 解析等平台功能和能力。html
资源可贵赶忙先关注，而后后续学习。git
本文将为您详细介绍组件封装。github
什么是组件封装
组件封装就是对具备上下层级关系的组件进行合并，隐藏内部细节，只保留顶层组件的过程。表如今组件树中，被封装的组件只能看到顶层组件，并以“小盒子”图标进行标识；表如今页面操做区，被封装组件的内部组件（子孙组件）不可被点击选中，只能对顶层组件进行操做。在对封装组件进行缩放操做的时候，子孙组件的大小被等比缩放、位置被线性变换。服务器
操做方式
右键菜单操做
右键菜单能够在组件树和场景区中在组件上单击鼠标右键呼出，点击菜单中的"封装"指令便可对组件及其全部子孙组件进行封装，相反的，点击菜单中的“解封”（只有已封装组件才有该项）指令便可对该封装组件进行解除封装，还原为本来的树状结构。ide
组件树操做
比起右键菜单方式进行封装操做，组件树独有的双击操做更加便捷。在组件树上双击待封装组件能够快速进行封装操做；在组件树上双击已封装组件能够进行快速解除封装操做。布局
使用场景
组件封装看似简单，带来的改变倒是多重的。学习
优化页面结构
经过对整个组件树不一样功能块合理划分，而后进行分别封装，页面结构变得简单清晰。优化
功能抽象，配置集中
码良具备强大的脚本编辑能力，能够经过脚原本接收用户配置、控制组件行为、串联业务逻辑。可是，若是不能合理使用脚本，尤为是若是开发者对用户配置不进行集中管理，会形成使用者面对散落到各个组件的自定义配置无从下手。有了组件封装功能，开发者在进行模板页面的开发时，经过合理划分功能块，将同属一个功能的局部组件们进行封装，同时将自定义用户配置编写在该功能块顶层组件上，内部组件经过“数据总线“来获取用户配置参数，实现了功能抽象、配置集中，使用者不用再面对复杂的页面结构和不知道去哪找的众多配置项。url
权限控制
实际使用中，还有一种状况，因为页面结构过于复杂，页面模板使用者（一般是缺少专业技术能力的运营人员）由于缺少足够的了解而随意增减组件或调整组件位置等，形成页面功能被破坏，组件封装事后，一方面，运营经过集中配置对页面进行配置，下降认知难度。另外一方面，能够经过禁止解除组件的封装来阻止对功能块内部的修改，虽然目前码良并无实现根据用户职业角色来禁止解除封装功能，可是封装操做仍能使得组件被破坏的难度加大，必定程度上保证了页面功能的完整性。spa
组合组件
封装后的组件仅限于当前页面复用（复制使用），那么有没有一种方法使封装组件变成普通组件同样，无限制的在其余页面使用呢？答案固然是有，组合组件就是专门干这个的。
如图，经过相似前面组件封装的作法，打开右键菜单，点击”另存为组合组件“指令，按提示而后输入必要的信息，就能够将这个组件功能块存储到服务器，供他人使用了。
看到这里你也许会奇怪，组合组件和组件封装彷佛没有什么关联。实际上，合成组件生成时，会自动进行组件封装，所以在其余页面使用了合成组件之后，在组件树中会看到一个标有小箱子图标（封装的标识）的组件。
支持咱们
开源项目须要的是持续地坚持，而咱们坚持的动力固然也来自于大家的支持 来都来了，加个关注再走吧
项目代码：https://github.com/ymm-tech/gods-pen
项目代码(国内镜像)：https://gitee.com/ymm-tech/gods-pen