音频组件

代码示例

namespace plugin\xbCode\app\demo\controller;

use support\Request;
use plugin\xbCode\XbController;
use plugin\xbCode\builder\Builder;
use plugin\xbCode\builder\Renders\Form;

class AudioDemoController extends XbController
{
  /**
   * 添加带音频上传的示例表单
   * @param \support\Request $request
   * @return \support\Response
   */
  public function add(Request $request)
  {
    if ($request->method() === 'POST') {
      $post = $request->post();
      // 这里的 audio 字段就是上传后的音频地址 / 对象
      // TODO: 根据你的业务保存 $post['audio']
      // 保存逻辑略
      return $this->success('保存成功');
    }

    $builder = Builder::form(function (Form $builder) {
      // 不包面板，仅示例，可按需调整
      $builder->useForm()->wrapWithPanel(false);

      // 添加上传音频组件
      $builder->addRowUploadAudio('audio', '音频文件')
        // 仅允许选择音频类型（浏览器 accept，前端校验）
        ->accept('audio/*')
        // 单文件上传（如需多文件传 true）
        ->multiple(false)
        // 限制最大 10MB
        ->maxSize(10 * 1024 * 1024)
        // 选择后自动上传
        ->autoUpload(true)
        // 按需选择是否允许拖拽上传
        ->drag(true)
        // 描述信息
        ->description('仅支持 mp3、wav 等音频格式，最大 10MB');
    });

    // 表单提交方法
    $builder->setMethod('POST');

    return $this->successRes($builder);
  }
}

通用组件参数

这些参数可以在任何组件上通过链式调用设置，例如：$component->className('w-full')->hiddenOn('this.disabled');

通用表单项参数

音频组件参数