常见问题

---

表单项（select、radioGroup等）的“option”是异步数据，如何处理？

通过配置request选项，参考代码：

{
  label: '角色',
  value: '',
  name: 'roleIdList',
  type: 'select',
  request: () => { 
    return getRoleList({ 
      pageSize: -1, 
    }).then((res: any) => { 
      return res.rows.map((item: any) => { 
        return { 
          value: item.id, 
          label: item.name 
        } 
      }) 
    }) 
  } 
}

---

表单项如何插槽？

通过配置slots选项，参考代码：

TIP

slots的数据结构是[{ name: string, alias: string }],之所以设计成这样的结构而不是字符串数组是为了防止插槽重名，比如有多个输入框，都有prepend插槽，就可以通过设置别名（alias）来区分

{
  label: '角色',
  type: 'input',
  ...,
  slots: [ 
    {
      name: 'prepend', 
      alias: 'prepend'
    }, 
    {
      name: 'append', 
      alias: 'append'
    } 
  ] 
}，
{
  label: '角色',
  type: 'input',
  ...,
  slots: [ 
    {
      name: 'prepend', 
      alias: 'prepend1'
    }, 
    {
      name: 'append', 
      alias: 'append1'
    } 
  ] 
}

<pro-form>
  <template #prepend>test</template>
  <template #append>test</template>
  <template #prepend1>test</template>
  <template #append1>test</template>
</pro-form>