WebApp【公共组件库】@前端(For Git Submodule)
Tevin
2025-03-18 fdeb869c386da95150a087bc22bcebc4e57d0f76
_cursor.ai/forms.doc/form.doc/CForm.doc.md
@@ -13,16 +13,18 @@
## 组件参数
- `formData` (Object,必填):表单数据对象,用于存储表单各项的值
- `autoScrollToError` (String,可选):是否自动滚动到错误位置,可选值有 on、off,默认为 off
- `autoScrollToError` (String,可选):是否自动滚动到错误位置,默认为 off
  - `on`:启用自动滚动
  - `off`:禁用自动滚动
- `onChange` (Function,可选):表单项变化的回调函数,参数为变化的表单项数据
- `onFinish` (Function,可选):表单完成的回调函数,仅在提交且通过表单验证后调用,参数为整个表单数据
## 实例方法
- `$submit`:手动触发表单提交,会执行表单验证
- `$preVerify`:提前验证指定的表单项,参数为表单项名称数组和回调函数
- `$setErrors`:直接设置表单错误,参数为错误对象,格式为 `{字段名: 错误信息}`
- `$setScrollTop`:设置滚动位置,参数为滚动的 top 值
- `$preVerify(keys, callback)`:提前验证指定的表单项,参数为表单项名称数组和回调函数
- `$setErrors(errors)`:直接设置表单错误,参数为错误对象,格式为 `{字段名: 错误信息}`
- `$setScrollTop(top)`:设置滚动位置,参数为滚动的 top 值
## 使用示例
@@ -31,7 +33,7 @@
```html
<template>
  <CForm 
    :form="form"
    :formData="form"
    :onFinish="handleFinish"
  >
    <CFormItem name="username" label="用户名" required>
@@ -78,7 +80,7 @@
```html
<CForm 
  :form="form"
  :formData="form"
  autoScrollToError="on" 
  :onFinish="handleFinish"
>
@@ -98,11 +100,11 @@
```html
<CForm 
  ref="form" 
  :form="form"
  :formData="form"
  :onFinish="handleFinish"
>
  <!-- 表单项 -->
  <button @tap="submitForm">提交</button>
  <button @tap="evt => submitForm()">提交</button>
</CForm>
```