简介
组件的设置器面板可以分为属性,样式,事件和高级4个部分,不同的组件支持不同的配置项,以达到用户实现各种不同的目标。设置器配置的内容,都会以配置项的形式传递给对应的组件。
属性面板
属性面板中包含组件可以设置的各种配置项,前面的标题是可以通过悬浮获得该配置项的使用说明,中间为设值区域,会根据配置项的不通类型变更为不通的设置表单组件,右侧则为控制区域,可以绑定变量,切换不通的设值类型去进行配置自定义。
变量绑定会在后续章节进行详细说明
样式面板
样式面板中,行内样式可以通过变量绑定去定义一个css property对象,源码编辑则是给当前组件对象生成一个id,可以通过给id编写css去实现组件的样式自定义,需要一定的css基础,其它内容则是可视化方式实现了组件的样式自定义配置。
事件面板
事件是组件对外交互的重要部分,在组件达成某种条件后会触发事件内容,绑定的事件可以添加一系列的动作,常见的交互操作都可以通过事件完成相应的联动。
示例
这里举个例子,使用事件打开弹窗,并在填写完表单后,进行保存表单,关闭弹窗,并刷新表格数据
此时即可预览查看按钮是否可以控制弹窗的显示隐藏
高级面板
条件渲染
条件渲染用于控制当前组件是否渲染,可以通过开关直接控制,也可以通过绑定变量动态控制,适合用于根据用户权限显示不同页面内容等场景。
循环渲染
任意组件内均做循环渲染,绑定循环数据(必须要是数组)后,会根据数组长度实现该组件的重复渲染,组件内部的变量绑定可以通过this.item(item是默认的迭代变量名,修改后为自己修改的值)获取到当前的迭代变量,this.index是当前循环的索引值。配置不同的 key 可以方便在多层循环中使用不同层级的循环 item 值。