代码编辑器
什么是代码编辑器？
代码编辑器顾名思义是 Code 编辑器，可进行 JavaScript 和 CSS 的原生代码开发。结合可视化开发和传统代码开发，增强了扩展性。如下图单击代码编辑器入口：
适用场景
使用代码编辑要求开发者有一定的 JavaScript 基础，它能帮助开发者在使用微搭低代码进行拖拽式开发时，根据业务需求完善应用的逻辑丰富度和复杂度。
基本功能
模块介绍
代码编辑器可以分为全局配置区、页面配置区和编译区，在页面配置区中包含了对应应用中每个单独的页面的文件夹。
- 全局配置区
- 页面配置区
- 编译区
| 模块 | 功能 |
|---|---|
| handler | Handler 是页面的方法集合，若您需要在某页面下调用，则在该页面 Handler 下新建方法，即能够在页面中调用组件、变量和平台方法等，请参见 Handler 方法使用介绍。 |
| common | Common 是公共的方法集合，用于多个页面间的方法复用，详情请参见 Common 全局方法复用说明。 |
| style | 全局配置区和每个页面都有 style 模块，在全局配置区的设置会作用到整个应用，单个页面的 style 只对页面内有效，详情请参见 Style 用法示例。 |
| lifecycle | 应用和每个页面都有自己的 lifecycle，全局配置区的 lifecycle 在应用使用的时候会生效，而只有当某个页面在页面堆栈最上层时，才会触发该页面的 lifecycle，详情请参见 应用生命周期介绍。 |
Style 用法示例
进入 style 页面，定义样式参数。
添加一个组件，选中该组件后进行 classname 参数选择。
LifeCycle 生命周期介绍
微搭支持应用、页面级别的生命周期函数，当对应的生命周期函数触发时，便会自动执行函数下已配置的自定义方法。
应用生命周期
在代码编辑器中，选择全局文件夹下的 lifecycle 文件，即可对应用的生命周期进行管理。
| 函数名 | 说明 |
|---|---|
| onAppLaunch | 当应用初始化完成时触发（全局只触发一次） |
| onAppShow | 监听小程序切前台事件。该事件与 App.onShow 的回调参数一致 |
| onAppHide | 监听小程序切后台事件。该事件与 App.onHide 的回调时机一致 |
| onAppError | 小程序发生脚本错误或 API 调用报错时触发 |
| onAppPageNotFound | 小程序要打开的页面不存在时触发 |
| onAppUnhandledRejection | 小程序有未处理的 Promise 拒绝时触发 |
页面生命周期
在代码编辑器中，选择对应页面文件夹下的 lifecycle 文件，即可对该页面的生命周期进行管理。
| 函数名 | 说明 |
|---|---|
| onPageLoad | 页面加载时触发。一个页面只会调用一次，可以在 onLoad 的参数中获取打开当前页面路径中的参数 |
| onPageShow | 页面显示/切入前台时触发 |
| onPageReady | 页面初次渲染完成时触发。一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互 |
| onPageHide | 页面隐藏/切入后台时触发。 如 app.navigateTo 或底部 tab 切换到其他页面，小程序切入后台等 |
| onPageUnload | 页面卸载时触发。例如 app.redirectTo 或 app.navigateBack 到其他页面时触发 |
Common 全局方法使用介绍
在应用编辑器中打开代码编辑器，在全局 common 方法集合下我们可以添加一个可为全局调用的名称为 getTime 的方法。
全局方法的调用介绍
在代码中调用前面定义的全局函数，打开代码编辑器，在首页 lifecycle 中我们调用 getTime 方法来作为示例，把获取到的当前日期给变量（调用方法放到 lifecycle 的 onPageLoad 中，可以在页面加载时触发执行方法调用和变量赋值操作）。
Handler 方法使用介绍
在代码编辑器-页面的 handler 中可以新增方法 method1，我们可以调用 数据源相关接口 cloud.dataSources，通过 create 新增数据源记录。
返回应用编辑器页面，页面中新增一个按钮，按钮行为可配置点击时调用自定义方法。
自定义方法可选择已建好页面 handler 方法 method1。
