v2版本

Field表单域容器

表单域容器是表单域的三级容器（一级是input、select等原生表单域，二级是被分装的AX-INPUT、AX-SELECT等组件），该容器是构成一个完整的form表单的基本单位，在表单域容器里包含的子元素有：input等原生元素或AX-INPUT等表单域组件，表单域校验模块，左侧label头，右侧help元素，下方alert元素。

基本结构

form容器主要_field、_field-label、_field-cont、_field-input和_field-help三个部分组成。

  • 输出
  • HTML
  • 表头：
    表单注解
    必填 
  •

复杂结构

我们在_field-input的三个方向提供了更多可用元素。

  • 在下方：_valid、ax-callout、_field-note等容器
  • 在内侧：_field-unit、_box-tools等容器
  • 在右侧：rep=disk、rep=image、rep=cube、rep=text等容器
  • 输出
  • HTML
  • 表头：
    正在校验...
    KM
    表头：
    请注意文字格式...
    表头：
    正在校验...
    获取手机号确认
    表头：
    正在校验...
    右侧rep=text是可换行的文本 
  •

所有原生表单域类型

_field表单域容器支持所有的原生表单域。辅助布局的标签有：_row（水平弹性布局）,_flex（弹性子元素）,ax-bc（垂直间距）,_grid（栅格布局）,ax-callout（警告）等。

表单容器不对type=submit/type=reset/button的宽度做处理，如果需要全宽的按钮，可追加_w-full样式类。

  • 输出
  • HTML
  • 姓名：
    注意：最多10个汉字
    必填
    户型：
    室
    厅
    卫
    请选择我司最新研发的AI智能产品：
    尺寸：
    单位米
    手机号：
    验证错误
    获取验证码
    头像：
    李勋
    文件：
    单选城市：
    多选城市：
    只选择1项么？
    radio单选：
    checkbox多选：
    数量：
    20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
    日期：
    搜索：
    颜色：
    范围：
    多行文本：
    进度条：
    评级：
    按钮：
  •

所有自定义表单域类型

_field表单域容器支持所有自定义表单域类型。

  • 输出
  • HTML
  • 姓名：
    注意：最多10个汉字
    必填
    户型：
    室
    厅
    卫
    请选择我司最新研发的AI智能产品：
    尺寸：
    手机号：
    验证错误
    文件：
    单选城市：
    多选城市：
    只选择1项么？
    radio单选：
    checkbox多选：
    数量：
    20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
    日期：
    搜索：
    颜色：
    范围：
    多行文本：
    批量上传：
    进度条：
    评级：
    按钮：
  •

开始使用 原生标准 通用模块 通用组件
Copyright © 2025 Axui All Rights Reserved. AXUI版权所有 粤ICP备2022110744号 CDN/云存储支持
AXUI前端框架的TypeScript、JavaScript、Css和Less文件均为开源软件，支持MIT许可协议。
本网站的图文内容中“会员可看部分”和“VIP可看部分”为非开源内容，未经许可不可转载和镜像，更不可二次加工售卖，如发现将追究法律责任，烦请用户们尊重知识产权。