docs: add formkit verfiyForm documentation (#327)

为 FormKit Schema 文档添加 verifyForm 的内容。相关改动查看 https://github.com/halo-dev/halo/pull/5464

/kind documentation

```release-note
None
```
wan92hen-patch-1
Takagi 8 months ago committed by GitHub
parent 3922a171a1
commit 64b30fae7d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -67,6 +67,83 @@ spec:
除了 FormKit 官方提供的常用输入组件之外Halo 还额外提供了一些输入组件,这些输入组件可以在 Form Schema 中使用。 除了 FormKit 官方提供的常用输入组件之外Halo 还额外提供了一些输入组件,这些输入组件可以在 Form Schema 中使用。
### verificationForm
#### 描述
用于远程验证一组数据是否符合要求的组件。
#### 参数
- `action`:对目标数据进行验证的接口地址
- `label`:验证按钮文本
- `submitAttrs`:验证按钮的额外属性
#### 示例
```yaml
- $formkit: verificationForm
action: /apis/console.api.halo.run/v1alpha1/verify/verify-password
label: 账户校验
children:
- $formkit: text
label: "用户名"
name: username
validation: required
- $formkit: password
label: "密码"
name: password
validation: required
```
:::tip
尽管 `verificationForm` 本身是一个输入组件,但与其他输入组件不同的是,它仅仅用于包装待验证的数据,所以并不会破坏原始数据的格式。例如上述示例中的值在保存后为:
```json
{
"username": "admin",
"password": "admin"
}
```
而不是
```json
{
"verificationForm": {
"username": "admin",
"password": "admin"
}
}
```
:::
示例中发送至验证地址的值为如下格式:
```json
{
"username": "admin",
"password": "admin"
}
```
当验证接口返回成功响应时,则验证通过,否则验证失败。
若用户在验证失败时想显示错误信息,可以在验证接口返回错误信息,该错误信息的结构定义需遵循 [RFC 7807 - Problem Details for HTTP APIs](https://datatracker.ietf.org/doc/html/rfc7807.html) 。例如:
```json
{
"title": "无效凭据",
"status": 401,
"detail": "用户名或密码错误。"
}
```
UI 效果:
<img src="/img/formkit/formkit-verify-form.png" width="50%" />
### repeater ### repeater
#### 描述 #### 描述

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Loading…
Cancel
Save