核心文件路径:/theme/html/demo*/src/js/components/core.datatable.js
所有参数的默认值见该文件 3369 行起。
data:
属性 | 功能 | 值 |
type | 数据源类型 | local / remote |
source | 数据源 | 链接或对象(见下方) |
pageSize | 每页项数 | 默认 10 |
saveState | 刷新、重新打开、返回时仍保持状态 | 默认 true |
serverPaging | 是否在服务端实现分页 | 默认 false |
serverFiltering | 是否在服务端实现筛选 | 默认 false |
serverSorting | 是否在服务端实现排序 | 默认 false |
autoColumns | 为远程数据源启用自动列功能 | 默认 false |
attr |
data.source:
属性 | 功能 | 值 |
url | 数据源地址 | |
params | 请求参数 | query: { } |
headers | 自定义请求的头 | { 'x-my-custom-header': 'some value', 'x-test-header': 'the value' } |
map | 数据地图,作用是对返回的数据进行整理和定位 | function (raw) { console.log(raw) // sample data mapping var dataSet = raw; if (typeof raw.data !== 'undefined') { dataSet = raw.data; } return dataSet; } |
layout:
属性 | 功能 | 值 |
theme | 主题 | 默认 default |
class | 包裹的 CSS 样式 | |
scroll | 在需要时显示横向或纵向滚动条 | 默认 false |
height | 表格高度 | 默认 null |
minHeight | 表格最小高度 | 默认 null |
footer | 是否显示表格底部 | 默认 false |
header | 是否显示表头 | 默认 true |
customScrollbar | 自定义的滚动条 | 默认 true |
spinner | Loading 样式 | { overlayColor: '#000000', opacity: 0, type: 'loader', state: 'primary', message: true, } |
icons | 表格中的 icon | { sort: { asc: 'flaticon2-arrow-up', desc: 'flaticon2-arrow-down' }, pagination: { next: 'flaticon2-next', prev: 'flaticon2-back', first: 'flaticon2-fast-back', last: 'flaticon2-fast-next', more: 'flaticon-more-1', }, rowDetail: { expand: 'fa fa-caret-down', collapse: 'fa fa-caret-right' }, } |
sortable | 是否支持按列排序 | 默认 true |
resizable | 是否支持鼠标拖动改变列宽 | 默认 false |
filterable | 在列中过滤 | 默认 false |
pagination | 显示分页信息 | 默认 true |
editable | 行内编辑 | 默认 false |
columns | 列 | 见本文下方 |
search | 搜索 | { // 按回车键确认 onEnter: false, // 文本内容 input: null, // 搜索延时 delay: 400, // 键名 key: null } |
layout.columns:
属性 | 功能 | 解释 |
field | 字段名 | 对应 JSON 的属性名,点击表头时作为排序字段名 |
title | 表头名 | 显示在表格头部 |
sortable | 默认排序方式 | 可选:'asc' / 'desc' |
width | 单元格最小宽度 | 值与 CSS 值一致,填数字时默认单位 px |
type | 数据类型 | 'number' / 'date' 等,与本地排序有关 |
format | 数据格式化 | 例格式化日期:'YYYY-MM-DD' |
selector | 是否显示选择框 | 布尔值或对象,如:{ class: '' } |
textAlign | 文字对齐方式 | 'center' |
overflow | 内容超过单元格宽度时是否显示 | 'visible':永远显示 |
autoHide | 自适应显示/隐藏 | 布尔值 |
template | 用于显示内容的 HTML 模板 | function(row) { return row.Id; } |
sortCallback | 排序回调 | 自定义排序方式,参 local-sort.js |
其它:
属性 | 功能 | 解释 |
translate | 翻译 | 参 core.datatable.js 3512 行,简体中文示例: translate: { records: { processing: '加载中...', noRecords: '没有找到相关内容', }, toolbar: { pagination: { items: { default: { first: '首页', prev: '前一页', next: '后一页', last: '末页', more: '更多', input: '请输入跳转页码', select: '设置每页显示项数', }, info: '当前第 {{start}} - {{end}} 项 共 {{total}} 项', }, }, }, }, |
extensions |
方法和事件:待完善。
network-printer
The-requested-URL-returned-error-404-Not-Found
aspnetcore-ef-getColumnBaseName
aliyun-ddos-without-bgp
metronic-menu-nav