表格 - Table对象

优质
小牛编辑
120浏览
2023-12-01

我们引入表格依赖后table后,我们就可以通过Table来进行相关表格的初始化和绑定相关事件。
返回的Table对象包括以下几个对象:

{
    list:[], //实例化的表格对象列表
    defaults:{}, //默认表格参数
    columnDefaults:{}, //默认列参数
    config:{}, //相关按钮的DOM选择类
    button:{}, //默认编辑、删除、排序按钮配置
    api:{} //封装的API方法
}

Table.list

其中Table.list存储的是表格实例化后的对象。比如我们实例化的表格有个id="mytable"的属性,则我们可以通过

Table.list['mytable']

来获取此表格的Bootstrap-table的对象。

Table.defaults

Table.defaults是指Bootstrap-table表格参数默认值。修改单一的值,我们可以直接通过

Table.defaults.showExport = false;

来进行修改

Table.columnDefaults

Table.columnDefaults是指Bootstrap-table表格列参数默认值修改单一的值,我们可以直接通过

Table.columnDefaults.align = 'left';

来进行修改

Table.config

Table.config是指表格使用到的按钮和工具栏的DOM选择类,一般情况下不建议修改。

Table.button

Table.button是指表格默认编辑、删除、挺拽按钮的配置信息,一般情况下不建议修改。

Table.api

Table.api封装了表格常用的方法、单元格事件及渲染方法。在表格中会经常使用到。

Table.api.init(defaults, columnDefaults, locales) //此方法用于初始化表格默认配置、表格列配置、写入语言包等操作
Table.api.bindevent(table) //此方法用于为表格中的元素绑定相关事件
Table.api.multi(action, ids, table, element) //此方法常用于批量操作请求,内部使用
Table.api.events.operate //操作栏单元格方法
Table.api.events.image //图片栏单元格方法
Table.api.formatter //格式化方法,后面单独介绍
Table.api.buttonlink(column, buttons, value, row, index, type) //按钮链接生成,内部使用
Table.api.replaceurl(url, row, table) //替换URL中的数据
Table.api.selectedids(table) //获取选中的条目ID集合
Table.api.toggleattr(table) //切换复选框状态
Table.api.getrowdata(table, index) //根据行索引获取行数据
Table.api.getrowbyindex(table, index) //根据行索引获取行数据
Table.api.getrowbyid(table, id) //根据主键ID获取行数据

Table.api.formatter

Table.api.formatter封装了许多FastAdmin表格列表中常用的单元格数据渲染的方法。

Table.api.formatter.icon //渲染成图标按钮
Table.api.formatter.image //渲染成单张图片
Table.api.formatter.images //渲染成多张图片
Table.api.formatter.content //内容自动截取
Table.api.formatter.status //渲染成状态
Table.api.formatter.normal //渲染成label
Table.api.formatter.toggle //渲染成开关
Table.api.formatter.url //渲染成文本框链接
Table.api.formatter.search //渲染成搜索链接
Table.api.formatter.addtabs //渲染成打开新选项卡链接
Table.api.formatter.dialog //渲染成弹窗链接
Table.api.formatter.flag //渲染成标志
Table.api.formatter.label //渲染成标志
Table.api.formatter.datetime //渲染成日期时间
Table.api.formatter.operate //渲染成操作栏按钮
Table.api.formatter.buttons //渲染成按钮组