单选框按钮组

单选框按钮组表单项

单选框按钮组表单项组件,用于在表单中添加按钮组样式的单选组件,支持垂直、平铺等多种布局模式。

用法示例

<?php
use plugin\xbCode\builder\Builder;
use plugin\xbCode\builder\Renders\Form;

// 创建表单
Builder::form(function (Form $builder) {
  // 添加单选框按钮组
  $builder->addRowRadioButton('status', '状态', '1', function ($component) {
    $component->options([
      ['label' => '启用', 'value' => '1'],
      ['label' => '禁用', 'value' => '0'],
    ]);
    $component->btnLevel('primary');
    $component->btnActiveLevel('success');
  });
  
  // 垂直模式
  $builder->addRowRadioButton('type', '类型', '', function ($component) {
    $component->options([
      ['label' => '类型1', 'value' => '1'],
      ['label' => '类型2', 'value' => '2'],
      ['label' => '类型3', 'value' => '3'],
    ]);
    $component->vertical(true);
  });
  
  // 平铺模式
  $builder->addRowRadioButton('level', '等级', '', function ($component) {
    $component->options([
      ['label' => '初级', 'value' => '1'],
      ['label' => '中级', 'value' => '2'],
      ['label' => '高级', 'value' => '3'],
    ]);
    $component->tiled(true);
  });
});

组件参数

参数名类型默认值说明
fieldstring-字段名,必填
titlestring-标题,必填
valuemixed''默认值
verticalboolfalse是否使用垂直模式
tiledboolfalse是否使用平铺模式
btnLevelstring'default'按钮样式,可选:link/primary/secondary/info/success/warning/danger/light/dark/default
btnActiveLevelstring'primary'选中按钮样式,可选值同btnLevel
optionsarray[]选项组,格式:[['label'=>'名称', 'value'=>'值']]
multipleboolfalse是否多选
labelFieldstring'label'选项标签字段名
valueFieldstring'value'选项值字段名
joinValuesbooltrue是否拼接值
extractValueboolfalse是否提取值
autoFillarray[]自动填充配置

使用说明

  1. 基本使用:通过 addRowRadioButton() 方法添加单选框按钮组,必须提供字段名和标题
  2. 选项配置:使用 options() 方法设置选项数组,每个选项包含label和value
  3. 按钮样式:通过 btnLevel() 设置默认按钮样式,btnActiveLevel() 设置选中状态样式
  4. 布局模式:使用 vertical() 启用垂直布局,使用 tiled() 启用平铺布局
  5. 多选模式:设置 multiple(true) 可启用多选功能
  6. 字段映射:可通过 labelField()valueField() 自定义选项的标签和值字段
  7. 值处理joinValues() 控制是否拼接值,extractValue() 控制是否提取值