Browse Source

增强 table height 选项,支持函数 (#1437)

pull/1442/head
贤心 12 months ago committed by GitHub
parent
commit
a8cecfc2a0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 11
      docs/table/detail/options.md
  2. 11
      src/modules/table.js

11
docs/table/detail/options.md

@ -123,6 +123,17 @@
- `height: 'full-30'` 设置相对可视屏幕的高度铺满。这是一个特定的语法格式:`full` 表示铺满;后面的数字表示当前 table 之外的元素占用的高度,如:表格头部到页面最顶部*加*表格底部距离页面最底部的“距离和”
- `height: '#id-30'` 设置相对父元素的高度铺满,其中 `#id` 即父元素的 ID 选择器,其计算原理和上述 `full` 相同。
**函数写法** <sup>2.9.1+</sup>
当需要动态改变表格高度时建议使用,如下以等效 `full-xx` 的写法为例:
```
height: function(){
var otherHeight = $('#search-content').outerHeight(); // 自定义其他区域的高度
return $(window).height() - otherHeight; // 返回 number 类型
}
```
</td>
<td>number<br>string</td>
<td>-</td>

11
src/modules/table.js

@ -360,6 +360,9 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
that.parentHeightGap = parentDiv.pop();
that.parentDiv = parentDiv.join("-");
options.height = $(that.parentDiv).height() - (parseFloat(that.parentHeightGap) || 0);
} else if (typeof options.height === "function"){
that.customHeightFunc = options.height;
options.height = that.customHeightFunc();
}
// 开始插入替代元素
@ -1727,15 +1730,19 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
var options = that.config;
var height = options.height;
var bodyHeight;
var MIN_HEIGHT = 135;
if(that.fullHeightGap){
height = _WIN.height() - that.fullHeightGap;
if(height < 135) height = 135;
if(height < MIN_HEIGHT) height = MIN_HEIGHT;
// that.elem.css('height', height);
} else if (that.parentDiv && that.parentHeightGap) {
height = $(that.parentDiv).height() - that.parentHeightGap;
if (height < 135) height = 135;
if(height < MIN_HEIGHT) height = MIN_HEIGHT;
// that.elem.css("height", height);
} else if (that.customHeightFunc) {
height = that.customHeightFunc();
if(height < MIN_HEIGHT) height = MIN_HEIGHT;
}
// 如果多级表头,则填补表头高度

Loading…
Cancel
Save