低代码编辑器与传统开发中的代码编辑器IDE相比，微搭的编辑器不单单融合页面设计模块、数据源，以及流程权限等，同时也是串接前端和后端最关键的一个场所，并且也是开发过程中使用最多、操作最频繁的地方。
主菜单，可以切换页面设计、数据源、素材和整个应用的设置。
页面管理/大纲树，是平时操作较多的地方，组件、所有的结构都可以在大纲树处看到。
变量/代码区，涉及到很多跟数据查询相关的变量，包括JS的自定义方法、自定义变量，以及事件流等。
编辑区，除了直接能够可视化地看到组件布局之外，也能够支持把后端的数据实时地展示在编辑区中，真正做到所见即所得，完成后端数据源的渲染。
数据查询/事件操作主面板，如果后续新建一些数据查询query，以及新建一些事件反应的时候在此处完成。
组件区，既包括了组件的拖拽区、也包括了组件的配置区。
各个模块的功能：
“大纲树”其实是显示对应的组件结构、嵌套逻辑、各种配置、事件绑定。如果组件层级比较深，也可以通过大纲树来对组件进行选择。
对组件完成配置之后，会对组价进行一些数据绑定，就会用到“代码区”。比如新建一些数据查询——query其实是一个联动后端数据库、数据表或者是API的一个中间变量，可以通过这个变量用表达式的方式跟组件进行一个联动和绑定；完成数据的绑定之后，整个的开发工作就基本完成了。
组件的“配置”区
在“配置”面板，可以对组件的一些属性进行配置。切到表达式模式之后，可以直接对新建的变量进行绑定，就会把对应的值在编辑区看到，就会渲染出来。
除了属性和样式配置以外，有时还需要进行一些事件的操作，不同的组件有不同的事件，可以对触发条件进行事件绑定，在事件面板进行配置。
- End -
网友评论