知识库应用搭建
1. 使用场景
在普通表单里放置富文本组件,通过自定义的展示页面去获取表单的数据
2. 视频展示
3. 操作步骤
3.1 创建普通表单
在表单里放置一个单行文本以及一个富文本组件,单行文本可以修改标题,点击保存
如图所示:
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622648496081-2441ceb0-135d-4064-803c-d60fa6f2098a.png)
3.2 创建自定义页面
在自定义页面拖拽一个表格组件,点击数据源,创建远程 API,修改名称、请求地址、需求参数以及数据处理
(1)通过数据列的增加删除或者修改去改变数据列
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622649990851-35ab27a6-3a6c-4563-ae7a-0fe3d1f6cc85.png)
请求地址:宜搭平台接口(页面数据源可直接调用)
参考文档中表单实例的第六点「根据条件搜索表单实例详情列表」
地址的前缀为 https://www.aliwork.com/dingtalk/web/
中间为当前表单页地址栏的 APP
后缀为 /v1/form/searchFormDatas.json
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622649091606-76254759-a323-47ef-bbc9-1333cd7410ef.png)
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622649003771-6694f6d3-e913-4bfc-96af-24a97b59093b.png)
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622648721834-fe5735e0-a9ef-4a1a-ac25-6c5321baf8b2.png)
3.3 请求参数的获取在首页的应用设置里,找到对应的表单,复制表单 ID,放入到请求参数里,参数名不变,参数值为表单 ID
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622649233388-c60f2bf5-b1c5-4bae-9d55-cb67a57bcbe4.png)
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622649323173-aec5cfdb-419a-4e23-b3a3-aa1808e3f47a.png)
3.4 点击数据处理右边的加号,选择请求完成回调函数,可以查看文档中的代码
自定义页面调用接口处理数据展示到表格中
参考文档:https://www.yuque.com/yida/subject/vswqzz
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622649351005-0391b361-5b74-4b76-ae79-f8825ad732a0.png)
可以先把整段代码先复制到数据处理中,其中,在 let arr={ }的括号里,只需要留下 instid:item.formInstId,其余的代码可以全部删除
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622649568549-fa7a66fd-ac82-4843-b1cf-76075ac26990.png)
在数据列里面修改需要的字段,通过下图去获取需要的字段数据
如图所示(我的表单里只有标题,所以我在代码里值添加标题属性,获取到标题属性的唯一标识符,在唯一标识符前添加 Item.formData.)
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622650657433-efdd8655-54c0-4df1-90bd-8b210a7ce877.png)
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622650703442-ddbc4d32-3c42-4178-952f-e41cd9f2641c.png)
返回编辑页面,点击数据源,创建变量绑定,变量绑定选择一开始创建的远程 API 的名称
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622650919992-6b9f447e-51ab-4b0d-ab26-91a9801ec1bf.png)
点击编辑页面的操作页,自动跳转后点击按钮
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622651032357-eac02097-d447-47c7-820a-fb7c03a6511f.png)
点击回调函数,添加绑定动作 onActionClick,点击保存
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622651075890-058aeebb-3c9d-47e9-8abe-eab872daa16a.png)
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622651137396-8f02ef2d-e4b1-48f3-b879-599d221119fd.png)
创建好绑定动作后会自动弹出一个 JS 页面,需要在里面写上下图的代码
export function onActionClick(rowData) {
const id = rowData.instid;
this.utils.router.push('Push',{formInstId: id},true,true)
console.log(rowData);
}
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622651297241-d90bdd24-cdd7-45e3-a268-179ffdff060d.png)
在 this.utils.router.push('push') 中括号里的 push 是放数据详情页上面问号前的地址
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1622651535016-550cfc4d-d946-4aef-9fd5-e18d0a1f6989.png)
这个时候返回应用的首页,就可以看到自定义获取到的表单数据,并且点击的时候可以跳转
「点我免费咨询!」
快人一步进入数字化时代
--------------------获取宜搭最新信息,欢迎关注我们--------------------
![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1652066359439-0d9cb8a0-075d-49be-b703-6b1c0f2fd9d1.png)