如果让表单支持单选 ?

本文将介绍在代码和XML配置中的修改,支持表格的单选功能。

先自定义一个widget,继承平台默认的table

@SPI.ClassFactory(
  BaseElementWidget.Token({
    viewType: ViewType.Table,
    widget: 'MyRadioTable'
  })
)
export class MyRadioTable extends TableWidget {
  @Widget.Reactive()
  protected get selectMode(): ListSelectMode {
    return ListSelectMode.radio;
  }
}

注册layout

如果当前是主表格,那么xml配置如下

const xml = `<view type="TABLE">
    <pack widget="group">
        <view type="SEARCH">
            <element widget="search" slot="search" slotSupport="field" />
        </view>
    </pack>
    <pack widget="group" slot="tableGroup">
        <element widget="actionBar" slot="actionBar" slotSupport="action">
            <xslot name="actions" slotSupport="action" />
        </element>
        <element widget="MyRadioTable" slot="table" slotSupport="field">
            <element widget="expandColumn" slot="expandRow" />
            <element widget="RadioColumn"  />
            <xslot name="fields" slotSupport="field" />
            <element widget="rowActions" slot="rowActions" slotSupport="action" />
        </element>
    </pack>
</view>`

registerLayout(xml, {
    moduleName: '模块名称',
    model: '模型',
    viewType: ViewType.Table
})

如果当前的表格是form表单页面的表格,那么xml配置如下

const xml = `<view type="TABLE">
    <view type="SEARCH">
        <element widget="search" slot="search" slotSupport="field" />
    </view>
    <element widget="actionBar" slot="actionBar" slotSupport="action">
        <xslot name="actions" slotSupport="action" />
    </element>
    <element widget="MyRadioTable" slot="table">
        <element widget="expandColumn" slot="expandRow" />
        <element widget="RadioColumn"  />
        <xslot name="fields" slotSupport="field" />
        <element widget="rowActions" slot="rowActions" />
    </element>
</view>`

registerLayout(xml, {
    moduleName: '模块名称',
    model: '模型',
    viewType: ViewType.Table
})

Oinone社区 作者:汤乾华原创文章,如若转载,请注明出处:https://doc.oinone.top/frontend/4769.html

访问Oinone官网:https://www.oinone.top获取数式Oinone低代码应用平台体验

(0)
汤乾华的头像汤乾华数式员工
上一篇 2023年11月27日 下午2:26
下一篇 2023年11月28日 上午10:29

相关推荐

  • oio-empty-data 空数据状态

    何时使用 当目前没有数据时,用于显式的用户提示。 初始化场景时的引导创建流程。 API 参数 说明 类型 默认值 版本 description 自定义描述内容 string | v-slot – image 设置显示图片,为 string 时表示自定义图片地址 string | v-slot false imageStyle 图片样式 CSSProperti…

    2023年12月18日
    12800
  • 自定义的复杂字段配置透出字段

    学习这篇文章之前,需要先学会使用在界面设计器自定义一个前端组件,如果您还不会,可以先看这篇文章 默认情况下,当开前端发人员自定义了一个复杂字段,比如M2O、O2M、M2M的字段,那么Graphql查询的时候,只会查询id跟name这两个字段,如果还想查询字段的字段,那么可以通过配置化的方式来处理 1: 在界面设计器的组件区域中新增对应的字段 2: 设计元件,…

    2023年11月9日
    24300
  • 组件生命周期(v4)

    阅读之前: 你应该: 了解DSL相关内容。母版-布局-DSL 渲染基础(v4) 对第三方框架的组件生命周期有所了解。如Vue组件生命周期 了解平台实现的Class Component(ts)相关内容。Class Component(ts)(v4) 组件生命周期 任何一个Widget其标准生命周期应当包括beforeCreated、created、before…

    2023年11月1日
    12610
  • 默认布局模板(v4)

    默认布局 表格视图(TABLE) <view type="TABLE"> <pack widget="group"> <view type="SEARCH"> <element widget="search" slot="sea…

    2023年11月1日
    13700
  • 表单字段API

    FormFieldWidget 表单字段的基类,包含了表单字段通用的属性跟方法 示例 class MyFieldClass extends FormFieldWidget{ } 字段属性 属性名 说明 类型 可选值 默认值 value 当前字段的值 any – null formData 当前表单视图的数据 Object – {} rootData 跟视图的…

    2023年11月15日
    9300

发表回复

登录后才能评论