开发者学堂课程【低代码认证-第一章:项目评选系课程:1.2项目评选系统的低代码基础】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/1007/detail/15054
项目评选系统的低代码基础
内容介绍
一、涉及核心功能及知识点
二、动作面板功能概述
三、开发者中心介绍
四、常用的 API 参考
五、常用 API 使用示例(1)
六、常用 API 使用示例(2)
七、数据源面板
八、宜搭接口
九、自定义页面表单数据实践
十、实操演练
继续学习项目评选系统实践第二节项目评选实践的低代码基础。本小节会讲解一个自定义页面查看表单数据的实践案例,通过拆解本小节的案例对这些功能一一进行介绍,从而了解项评选实践所需要的的代码基础。
一、涉及核心功能及知识点
首先来看自定义页面查看表单数据案例涉及的核心功能及知识点。这里面会涉及到的有动作面板、数据面板,还有宜搭接口的功能。动作面板功能是按钮绑定动作去配置跳转的 API,跳转到详情数据当中,数据源面板功能,通过数据源面板新增远程数据源调用接口,获取表单数据,新增变量数据源保存页面临时变量。宜搭接口功能,宜搭提供应用维度可以直接调用的接口和第三方获取的大数据的接口。了解了涉及的核心功能及知识点后,来看一下动作面板。
二、动作面板功能概述
动作编码是可以用来编写 javaScript 代码来实现一些更定制化的需求,支持动作绑定。这里面的支持动作绑定指的是组建的动作和动作面板当中自定义的函数进行绑定。
如右图所示,可以选择页面属性在当中有生命周期,在这里就可以去进行动作绑定,绑定完成之后,就可以在这里去书写页面加载完成时的函数
动作面板也支持直接书写 JS 代码定义函数。也支持书写 debugger 进行断点调试,在动作面板当中可以书写哪些由宜搭封装的函数,这些函数又可以在哪里去进行寻找呢?首先来看一下宜搭的开发者中心。
三、开发者中心介绍
开发者中心提供 API 文档、组件使用的示例、常见业务场景来继续深入并解决所遇到的这些问题。
如图片所示,这里标注的是一个 API 参考,这里是宜搭执行特定任务的代码块封装成可以随时被调用的 JS 函数或者说 JS 方法,可以直接将拿取出来,然后去放置在动作面板当中进行使用。当然除了 API 参考以外,还有专题、布局组件、基础、表单、高级组件,还有一些场景案例等等
四、常用的 API 参考
这里面常用的 API 方法有 get、set、 getvalue、 setvalue,分别都是去获取当前组件或者表单的属性值或者是值。还有 show和hide 的方法适用于显示或隐藏对话框,dataSourceMap 用来加载远程数据源 utils.dialog 用于弹出对话框,utils.router.push 用于路由(页面跳转)。
五、常用 API 使用示例(1)
get 的作用是获取当前文本组件的属性值。用法是 this.$(fieldld).get(key) 第四点儿,fieldld 是组建的唯一标识,Key 是组件的属性,如右图所示。可以通过 get 去获取文本里面的 content,也就是这里面文本的内容。
六、常用 API 使用示例(2)
来看一下 dataSourceMap 用于加载远程数据源。用法是this.dataSourceMap.mockReq.load(params)。mockReq 是远程数据源名称,params 是请求携带参数
如图所示,在这里面就先通过 cast 定义了一个 parents,也就是定义请求的携带参数,完成之后去调用加载远程数据。这里已经将远程数据源的名称更改为已经定义好的远程数据源的名称,用这种方式去进行调用。utils.dialog 的作用是弹出对话框,用法是 this.utils.dialog(options),这里面的 options:dialog 是属性。图片当中以蓝色框出的部分是使用到了 utils.dialog 这里 dialog 的属性包含 Titletype 还有 content 等等一些属性。动作面板的常用 API 讲解完成后
七、数据源面板
讲解一下数据源面板。数据源面板可以声明一个变量或者一个远程变量。由于动态的展示一些数据使用在控件的属性配置上可以进行对数据源的数据绑定。新建的数据源分为三个种类,分别是参数数据源、变量数据源和远程数据源。参数数据源是系统默认传入该数据源用于获取当前 url 当中的参数。变量数据源一般用于保存配置项、页面、临时变量等。远程数据源一般是从一个服务端接口中获取数据。图片右图展示的是变量数据源,在这个输入框内可以支持的变量有字符串、数字、布尔值、对象数组,还有空值。
八、宜搭接口
宜搭提供以下两种调用数据的接口,分别为宜搭平台接口和 Open API 开放接口,宜搭平台接口是宜搭页面数据源可以直接调用的接口。支持应用维度接口,将当前组织架构内的数据获取到。
Open API 开放接口。开放接口需要申请接口的调用权限,支持定时将数据拉回到自建系统中进行精加工或归档。也可以将表单提交、流程发起操作的入口集成到现有的平台上。这就是宜搭的接口。