Skip to content
双端兼容 · 桌面 + 移动

Field 字段包装

EwField 是表单字段的排版外壳:标签 + 控件插槽 + 错误/提示文案。它不接管值与校验, 只负责一个字段的视觉结构 —— 与 EwInput / EwTextarea / EwSelect 任意组合出前台提交表单。

基础用法

标签 / 必填星标 / 错误与提示
error 传非空字符串即进入错误态,并隐藏 hint。
仅用于回复,不会公开
邮箱格式不正确
vue
<EwField label="称呼" required>
  <EwInput v-model="name" />
</EwField>
<EwField label="邮箱" hint="仅用于回复,不会公开">
  <EwInput v-model="email" type="email" />
</EwField>
<EwField label="邮箱" :error="emailError">
  <EwInput v-model="email" :error="!!emailError" />
</EwField>

与 EwContactForm 的分工

三个字段以内的简单联系表单直接用 EwContactForm(已内置校验与成功态); 字段更多或需要自定义校验流程时,用 EwField + 各输入组件自由组装。

API

Props

属性说明类型默认值
label字段标签string
error错误提示(非空即错误态)string
hint提示文案(有 error 时隐藏)string
required必填星标booleanfalse

插槽

插槽说明
default控件区(放任意输入组件)
label / hint标签/提示覆写

基于 MIT 许可证发布