Skip to content

远程组件

目前支持五个远程组件,这些组件其实就是包装的对应得静态组件,为什么需要这几个组件?

这些常用组件得数据在后台几乎都是从后台数据库获取的。所以对他们进行二次包装之后,能够更易用。

用法几乎和原组件一致,只需要你添加一个table表名即可,调用 table 方法

远程级联选择器

php
 $form->remoteCascader('parent_id', '父级分类')
                ->table('cms_category')
                ->checkStrictly()
                ->label('name')
                ->value('id')
                ->pid()
                ->class('w-full');

远程 Select 组件

php
 $form->remoteSelect('parent_id', '父级分类')
                ->table('cms_category')
                ->label('name')
                ->value('id')
                ->class('w-full');

远程 Tree 组件

php
 $form->remoteTree('parent_id', '父级分类')
                ->table('cms_category')
                ->checkStrictly()
                ->label('name')
                ->value('id')
                ->pid()
                ->class('w-full');

远程 Tree Select 组件

php
 $form->remoteTreeSelect('parent_id', '父级分类')
                ->table('cms_category')
                ->checkStrictly()
                ->label('name')
                ->value('id')
                ->pid()
                ->class('w-full');

远程 Select Api 组件

php
 $form->remoteApiSelect('departments', '部门')
                ->api('permissions/departments') // api 接口地址,注意不需要 api 前缀
                ->label('name')
                ->value('id')

通用 fetch

任意组件都可以通过 fetch() 声明远程数据。后端只输出 JSON 安全配置,前端 catchForm 运行时使用项目 http 发起请求。

php
$form->select('user_id', '用户')->fetch('users/options', to: 'options');

序列化结果:

json
{
  "effect": {
    "fetch": {
      "action": "users/options",
      "to": "options",
      "method": "GET"
    }
  }
}

前端 fetch adapter 会把项目 httpresponse.data 传给 FormCreate 的 config.onSuccess()。FormCreate 随后按 parse 或默认 data 字段提取最终值。

php
$form->tree('permissions', '')
    ->fetch('permissions/permissions', to: 'props.data', query: ['from' => 'role']);

fetch() 支持 actiontomethodquerydatadataTypeheadersparsewatchwaitkey。需要执行函数逻辑时,使用 handler key 在前端注册。