form 表单使用说明

未匹配的标注

Form 各项说明

基本form方法如下:

  ...
  public function form(): Form
  {
          return $this->baseForm()->body([
              TextControl::make()->name('name')->label('姓名'),
              ...
          ]);
  }
  ...
  • 调试 链式调用 debug(true) 方法

  • 默认值 使用data方法,存入对映数组

     form 方法中
     $this->baseForm()->debug(true)
     ->data(
            ['price'=>0,'amount'=>0,'re_status'=>'normal','state'=>'wait']
     )->body([
          //表单项
     ])
     ...

    表单项支持的通用方法

    • id() 组件唯一id
    • name 字段名
    • label 显示
    • value 默认值 不支持变量
    • readonly
    • static 是否静态显示
    • remark 显示小图标,鼠标移上去有提示

      表单验证

    • 必填项在body子项中使用 required(true)
    function form(){
        ...
        ->body([
        ...
        TextControl::make()->name('price')->label('单价')->required(true),
        ...
       ]);
    }
    • 正则校验及错误提示

      TextControl::make()->name('phone')->label('手机号')
          ->validations('matchRegexp:/^1\d{10}/')
          ->validationErrors(['matchRegexp'=>'必需是手机号']),

字段支持组件有如下几种:

  • TextControl

  • NumberControl

  • ImageControl

  • TagControl 使用 options(选项数组) 配置选项

  • SelectControl 使用 options(选项数组) 配置选项

    • labelField: 数据源中展示label的字段名称
    • valueField: 数据源中当作value的字段名称
  • RadioControl 使用 options(选项数组) 配置选项

    $states=['wait'=>'等待','success'=>'成功','error'=>'错误'];
    $this->form()->body([
        RadiosControl::make()->name('state')->label('订单状态')->options($states),
        SelectControl::make()->name('project_id')->label('项目ID')
                    ->labelField('title')->valueField('id')
                    ->options(Model::query()->get(['id','title'])),
    ]);
  • 。。。

    下拉选择框增加更多字段信息

    获取示例数据如下

    $options=[
    ['title'=>'产品名称','id'=>'2','desc'=>'这是介绍','created_at'=>'2023-6-9 12:49:53'],
    ['title'=>'产品名称','id'=>'2','desc'=>'这是介绍','created_at'=>'2023-6-9 12:49:53'],
    ];//options的配置
    //form表单中俄使用
    amisMake()->Form()->body([
    //因为 options 不是默认的label value格式需要配制
      amisMake()->SelectControl($name, $label)->options($options)
    ->valueField('id')
    ->labelField('title'),
    //表格显示多信息
      amisMake()->SelectControl($name, $label)->options($options)
    ->valueField('id')
    //使用table展示选项信息,列配置columns
     ->selectMode('table')->columns([['name' => 'title', 'label' => '产品'], ['label' => '创建时间', 'name' => 'created_at']]),
    //tpl展示更多信息
     //->menuTpl('<div>${label} - ${created_at} 介绍:${desc}  </div>')
    ]);

    也可以借用 picker 实现弹出curd表格选择。这个参考 amis表格内容

欢迎大家的补充和指正,谢谢

官方资源

owl admin 文档
demo地址
amis所有组件示例

本文章首发在 LearnKu.com 网站上。

上一篇 下一篇
《L03 构架 API 服务器》
你将学到如 RESTFul 设计风格、PostMan 的使用、OAuth 流程,JWT 概念及使用 和 API 开发相关的进阶知识。
《G01 Go 实战入门》
从零开始带你一步步开发一个 Go 博客项目,让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。
讨论数量: 0
发起讨论 查看所有版本


暂无话题~