# 如何实现新增证照时不同的按钮打开不同的新建布局

来源快照：`result_data_new_260518.json`

- 来源 ID：`1967600945378770926`
- 模块：低代码平台e-builder
- 目录：专题学习 - 场景专题 - 表单专题
- space ID：`1157961794811633670`
- 原文链接：未提供
- 产品基线：未提供

## 正文

**1.      场景说明：**

在【证照管理】场景中，有时会根据不同的证照类别进行证照信息新增，这里就需要设计多个按钮，绑定不同的新增表单布局。若要满足此需求可以利用配置固定参数layoutid的方式对对应新建布局表单进行绑定，即可实现点击按钮跳转至不同新建表单的效果。

 

展示效果如下图所示：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693093226553348&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

 

**2.      功能简介：**

若想实现以上效果，可以增加多个【表单视图】，再利用【自定义按钮】--【按钮动作】--【参数配置】，对所需表单进行按钮与表单布局间的关联配置。

 

 

**3.      操作说明：**

（1）     首先要新建一个【证照表单】，并设置【人员证书】和【企业证书】表单视图。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693093271175190&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

  


  


可以点击“编辑”按钮，对表单布局名称进行更改。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693093221728307&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

  


 

点击【人员证书】表单布局，即可对该表单进行编辑更改，形成【人员证书】新建表单视图。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693093271175269&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

  


点击【企业证书】表单布局，即可对该表单进行编辑更改，形成【企业证书】新建表单视图。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693097390866475&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

 

  


（2）     进入对应表单后台，点击【按钮】-【新建】添加【自定义按钮】。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693097331261526&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

  


并对按钮进行详情配置，首先配置自定义按钮的基本信息。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693101668171784&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

  


该按钮的【显示位置】可以根据需求设置其显示位置在表单视图或表格视图，此场景设置其显示位置为【表格视图】-【右上角】。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693101859168305&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

  


完成【基本信息】配置后，进行【按钮动作】配置。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693101859168364&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

  


配置参数名称为固定名称layoutid。（其中layoutid参数为布局id，他对应了当前状态下的布局id。）

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693105947246597&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

  


 

我们此处想要实现定向打开一个固定界面则可以使layoutid等于该界面的布局id。

所以此处的参数值我们也选取为固定值，等于所需界面的布局id。我们可以将鼠标悬浮于所需布局的右上方更多按钮上，点击预览，进入预览界面。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693105947246627&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

  


进入预览界面后，复制浏览器地址中的 “layoutid=”部分的布局id数据至参数配置即可。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693106147688519&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

  


【企业证书】新建视图跳转配置与上述【人员证书】配置一致。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693110274883588&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

 

**4.      实现效果：**

点击【新建人员证书】自定义按钮，即可跳转至人员证书信息新增界面。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693110205833258&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

 

  


点击【新建企业证书】自定义按钮，即可跳转至企业证书信息新增界面。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157693110334488648&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)
