fix: add syncFixedRowHeight
This commit is contained in:
parent
1ed2de9c61
commit
929f501ff0
|
@ -168,6 +168,7 @@ var defaultProps = {
|
||||||
setRowParentIndex: function setRowParentIndex() {},
|
setRowParentIndex: function setRowParentIndex() {},
|
||||||
tabIndex: '0',
|
tabIndex: '0',
|
||||||
heightConsistent: false,
|
heightConsistent: false,
|
||||||
|
syncFixedRowHeight: false,
|
||||||
size: 'md',
|
size: 'md',
|
||||||
rowDraggAble: false,
|
rowDraggAble: false,
|
||||||
hideDragHandle: false,
|
hideDragHandle: false,
|
||||||
|
@ -1514,7 +1515,8 @@ var Table = function (_Component) {
|
||||||
columns = _props9.columns,
|
columns = _props9.columns,
|
||||||
heightConsistent = _props9.heightConsistent,
|
heightConsistent = _props9.heightConsistent,
|
||||||
bodyDisplayInRow = _props9.bodyDisplayInRow,
|
bodyDisplayInRow = _props9.bodyDisplayInRow,
|
||||||
lazyLoad = _props9.lazyLoad;
|
lazyLoad = _props9.lazyLoad,
|
||||||
|
syncFixedRowHeight = _props9.syncFixedRowHeight;
|
||||||
|
|
||||||
var headRows = this.headTable ? this.headTable.querySelectorAll('thead') : this.bodyTable.querySelectorAll('thead');
|
var headRows = this.headTable ? this.headTable.querySelectorAll('thead') : this.bodyTable.querySelectorAll('thead');
|
||||||
var expandedRows = this.bodyTable.querySelectorAll('.' + clsPrefix + '-expanded-row') || [];
|
var expandedRows = this.bodyTable.querySelectorAll('.' + clsPrefix + '-expanded-row') || [];
|
||||||
|
@ -1546,7 +1548,7 @@ var Table = function (_Component) {
|
||||||
}
|
}
|
||||||
// 为了提高性能,默认获取主表的高度,但是有的场景中固定列的高度比主表的高度高,所以提供此属性,会统计所有列的高度取最大的,设置
|
// 为了提高性能,默认获取主表的高度,但是有的场景中固定列的高度比主表的高度高,所以提供此属性,会统计所有列的高度取最大的,设置
|
||||||
// 内容折行显示,并又设置了 height 的情况下,也要获取主表高度
|
// 内容折行显示,并又设置了 height 的情况下,也要获取主表高度
|
||||||
if (heightConsistent || !bodyDisplayInRow && rsHeight) {
|
if (heightConsistent || !bodyDisplayInRow && rsHeight && syncFixedRowHeight) {
|
||||||
var leftHeight = void 0,
|
var leftHeight = void 0,
|
||||||
rightHeight = void 0,
|
rightHeight = void 0,
|
||||||
currentHeight = void 0,
|
currentHeight = void 0,
|
||||||
|
|
|
@ -76,6 +76,7 @@ import 'bee-table/build/Table.css';
|
||||||
| loadBuffer | 使用BigData高阶组件实现大数据加载时,上下加载的缓存 | number| 5
|
| loadBuffer | 使用BigData高阶组件实现大数据加载时,上下加载的缓存 | number| 5
|
||||||
| hoverContent | hover某行时,动态渲染行菜单元素,此方法需返回行菜单元素的内容 | Function|
|
| hoverContent | hover某行时,动态渲染行菜单元素,此方法需返回行菜单元素的内容 | Function|
|
||||||
| heightConsistent | 当固定列内容高度超出非固定列时,内容互错行,当此属性为true会将高度同步,当行过多时会有性能影响,所以建议非固定高度如果过高时,超出内容可以显示成省略号 | bool|false
|
| heightConsistent | 当固定列内容高度超出非固定列时,内容互错行,当此属性为true会将高度同步,当行过多时会有性能影响,所以建议非固定高度如果过高时,超出内容可以显示成省略号 | bool|false
|
||||||
|
| syncFixedRowHeight | 当bodyDisplayInRow为false的时候,同步固定列的高度 | bool | - |
|
||||||
| height | 自定义表格行高 | number | - |
|
| height | 自定义表格行高 | number | - |
|
||||||
| headerHeight | 自定义表头行高 | number | - |
|
| headerHeight | 自定义表头行高 | number | - |
|
||||||
| headerDisplayInRow | 设置表头的内容显示一行,超出显示省略号 | bool | true |
|
| headerDisplayInRow | 设置表头的内容显示一行,超出显示省略号 | bool | true |
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "bee-table",
|
"name": "bee-table",
|
||||||
"version": "2.3.15-beta.17",
|
"version": "2.3.15-beta.18",
|
||||||
"description": "Table ui component for react",
|
"description": "Table ui component for react",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
"react",
|
"react",
|
||||||
|
|
|
@ -103,6 +103,7 @@ const defaultProps = {
|
||||||
setRowParentIndex:()=>{},
|
setRowParentIndex:()=>{},
|
||||||
tabIndex:'0',
|
tabIndex:'0',
|
||||||
heightConsistent:false,
|
heightConsistent:false,
|
||||||
|
syncFixedRowHeight: false,
|
||||||
size: 'md',
|
size: 'md',
|
||||||
rowDraggAble:false,
|
rowDraggAble:false,
|
||||||
hideDragHandle:false,
|
hideDragHandle:false,
|
||||||
|
@ -1280,7 +1281,7 @@ class Table extends Component {
|
||||||
|
|
||||||
syncFixedTableRowHeight() {
|
syncFixedTableRowHeight() {
|
||||||
//this.props.height、headerHeight分别为用户传入的行高和表头高度,如果有值,所有行的高度都是固定的,主要为了避免在千行数据中有固定列时获取行高度有问题
|
//this.props.height、headerHeight分别为用户传入的行高和表头高度,如果有值,所有行的高度都是固定的,主要为了避免在千行数据中有固定列时获取行高度有问题
|
||||||
const { clsPrefix, height, headerHeight,columns,heightConsistent, bodyDisplayInRow, lazyLoad } = this.props;
|
const { clsPrefix, height, headerHeight,columns,heightConsistent, bodyDisplayInRow, lazyLoad, syncFixedRowHeight } = this.props;
|
||||||
const headRows = this.headTable ?
|
const headRows = this.headTable ?
|
||||||
this.headTable.querySelectorAll('thead') :
|
this.headTable.querySelectorAll('thead') :
|
||||||
this.bodyTable.querySelectorAll('thead');
|
this.bodyTable.querySelectorAll('thead');
|
||||||
|
@ -1313,7 +1314,7 @@ class Table extends Component {
|
||||||
}
|
}
|
||||||
// 为了提高性能,默认获取主表的高度,但是有的场景中固定列的高度比主表的高度高,所以提供此属性,会统计所有列的高度取最大的,设置
|
// 为了提高性能,默认获取主表的高度,但是有的场景中固定列的高度比主表的高度高,所以提供此属性,会统计所有列的高度取最大的,设置
|
||||||
// 内容折行显示,并又设置了 height 的情况下,也要获取主表高度
|
// 内容折行显示,并又设置了 height 的情况下,也要获取主表高度
|
||||||
if(heightConsistent || (!bodyDisplayInRow && rsHeight)){
|
if(heightConsistent || (!bodyDisplayInRow && rsHeight && syncFixedRowHeight)){
|
||||||
let leftHeight,rightHeight,currentHeight,maxHeight;
|
let leftHeight,rightHeight,currentHeight,maxHeight;
|
||||||
leftHeight = leftBodyRows[index]?Number(leftBodyRows[index].getBoundingClientRect().height).toFixed(2):0; // 有些浏览器中,取到的高度是小数,直接parseInt有问题,保留两位小数处理
|
leftHeight = leftBodyRows[index]?Number(leftBodyRows[index].getBoundingClientRect().height).toFixed(2):0; // 有些浏览器中,取到的高度是小数,直接parseInt有问题,保留两位小数处理
|
||||||
rightHeight = rightBodyRows[index]?Number(rightBodyRows[index].getBoundingClientRect().height).toFixed(2):0;
|
rightHeight = rightBodyRows[index]?Number(rightBodyRows[index].getBoundingClientRect().height).toFixed(2):0;
|
||||||
|
|
Loading…
Reference in New Issue