The custom page jumps to the form/flow chart to pass parameters.

1. Usage scenarios

It may be used to assign values to components after the data source is retrieved on the custom page. When the normal form is filled in, the value is assigned by default without manual input again.

2. Video tutorial

此处为语雀视频卡片，点击链接查看：王俊才-页面携带参数跳转.mp4

3. Procedure

3.1 Step 1: Create a custom page

3.1.1 pull two input boxes and button components into the page

Custom edit page

3.1.2 add onClick events to the button

Create action

Click OK

3.1.3 JS panel

JS panel

The following code can be directly copied in the JS panel,Note: You need to replace the unique identifier of the component.

• Route jump reference link:https://developers.aliwork.com/docs/api/yidaAPI#%E8%B7%AF%E7%94%B1%E7%9B%B8%E5%85%B3-api
• For more information about the pop-up message box, see:https://developers.aliwork.com/docs/api/yidaAPI#%E8%B7%AF%E7%94%B1%E7%9B%B8%E5%85%B3-api

export function onClick(){
  //name 和 sex 为上面输入框组件取值
  const name = this.$("textField_kq6ccx2b").getValue();
  const sex = this.$("textField_kq6ccx2c").getValue();
  //判断如果 name 和 sex 的值存在时执行下面跳转语句
  if(name && sex){
    //路由跳转
    //下面这个 url 为表单提交页面的url，将获取到的 name 和 sex 值以携带参数的形式传给表单页面，后面两个参数传true即可。
    this.utils.router.push("https://www.aliwork.com/APP_HQP0HX4ISBM4NV6RZR8T/submission/FORM-4A9667B1JA6RJCIO2XG4X5HBAVIH32CE4C6QKC4",
    {name,sex},true,true);
  }else{
    //弹出消息窗
    this.utils.toast({
      title: '姓名和性别字段不能为空',
      type: 'error',
      size: 'large',
    })
  }
}

3.2 Step 2: Create a form page

3.2.1 pull a single-line text component on the form page (pull the required component according to personal needs)

Common form editing page

3.2.2 open the data source and click urlParams

Add a data source

3.2.3 Component binding default values

Note:

• If a parameter exists in the url, it is the value of the parameter. Otherwise, set the default value: 「Please enter a name」
• If a parameter exists in the url, it is the value of the parameter. Otherwise, set the default value: 「Enter gender」

Set the default value of a name

Set the default gender attribute

4. Effect demonstration

Effect demonstration

5. Try it online

• https://www.aliwork.com/bench/coe? tplUuid=TPL_SWPY4IYIGRJXL902TG1P

-------------------- Get the latest information YIDA, welcome to follow US--------------------