fix: 纵向滚动条动态显示

This commit is contained in:
izbz wh 2019-05-27 10:16:46 +08:00
parent 06a0d594fd
commit c0167c3ed2
13 changed files with 85611 additions and 132289 deletions

View File

@ -367,6 +367,10 @@ var Table = function (_Component) {
if (nextProps.resetScroll) { if (nextProps.resetScroll) {
this.resetScrollX(); this.resetScrollX();
} }
// fix:模态框中使用table计算的滚动条宽度为0的bug
if (this.scrollbarWidth <= 0 && this.props.scroll.y) {
this.scrollbarWidth = (0, _utils.measureScrollbar)();
}
// console.log('this.scrollTop**********',this.scrollTop); // console.log('this.scrollTop**********',this.scrollTop);
}; };

View File

@ -1,7 +1,7 @@
'use strict'; 'use strict';
Object.defineProperty(exports, "__esModule", { Object.defineProperty(exports, "__esModule", {
value: true value: true
}); });
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
@ -20,29 +20,29 @@ exports.ObjectAssign = ObjectAssign;
*/ */
function sortBy(arr, prop, desc) { function sortBy(arr, prop, desc) {
var props = [], var props = [],
ret = [], ret = [],
i = 0, i = 0,
len = arr.length; len = arr.length;
if (typeof prop == 'string') { if (typeof prop == 'string') {
for (; i < len; i++) { for (; i < len; i++) {
var oI = arr[i]; var oI = arr[i];
(props[i] = new String(oI && oI[prop] || ''))._obj = oI; (props[i] = new String(oI && oI[prop] || ''))._obj = oI;
}
} else if (typeof prop == 'function') {
for (; i < len; i++) {
var _oI = arr[i];
(props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
}
} else {
throw '参数类型错误';
} }
} else if (typeof prop == 'function') { props.sort();
for (; i < len; i++) { for (i = 0; i < len; i++) {
var _oI = arr[i]; ret[i] = props[i]._obj;
(props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
} }
} else { if (desc) ret.reverse();
throw '参数类型错误'; return ret;
}
props.sort();
for (i = 0; i < len; i++) {
ret[i] = props[i]._obj;
}
if (desc) ret.reverse();
return ret;
}; };
/** /**
@ -51,11 +51,11 @@ function sortBy(arr, prop, desc) {
* @param {} property * @param {} property
*/ */
function compare(property) { function compare(property) {
return function (a, b) { return function (a, b) {
var value1 = a[property]; var value1 = a[property];
var value2 = b[property]; var value2 = b[property];
return value1 - value2; return value1 - value2;
}; };
} }
/** /**
@ -63,17 +63,17 @@ function compare(property) {
* @param {*} obj 要拷贝的对象 * @param {*} obj 要拷贝的对象
*/ */
function ObjectAssign(obj) { function ObjectAssign(obj) {
var b = obj instanceof Array; var b = obj instanceof Array;
var tagObj = b ? [] : {}; var tagObj = b ? [] : {};
if (b) { if (b) {
//数组 //数组
obj.forEach(function (da) { obj.forEach(function (da) {
var _da = {}; var _da = {};
_extends(_da, da); _extends(_da, da);
tagObj.push(_da); tagObj.push(_da);
}); });
} else { } else {
_extends(tagObj, obj); _extends(tagObj, obj);
} }
return tagObj; return tagObj;
} }

View File

@ -74,6 +74,45 @@ const columns = [{
render: renderContent, render: renderContent,
}]; }];
const columns1 = [{
title: '姓名',
key: "name",
dataIndex: 'name',
render: (text, row, index) => {
if (index < 4) {
return <a href="#">{text}</a>;
}
return {
children: <a href="#">{text}</a>,
props: {
colSpan: 5,
},
};
},
}, {
title: '年龄',
key: "age",
dataIndex: 'age',
render: renderContent,
}, {
title: '联系方式',
colSpan: 2,
key: "tel",
dataIndex: 'tel',
render: renderContent
}, {
title: '手机号',
colSpan: 0,
key: "phone",
dataIndex: 'phone',
render: renderContent,
}, {
title: '家庭住址',
key: "address",
dataIndex: 'address',
render: renderContent,
}];
const data = [{ const data = [{
key: '1', key: '1',
name: '小红', name: '小红',
@ -112,9 +151,26 @@ const data = [{
}]; }];
class Demo15 extends Component { class Demo15 extends Component {
constructor(props){
super(props);
this.state={
colFlag:false
}
}
onChange=()=>{
const colFlag = this.state.colFlag;
this.setState({
colFlag:!colFlag
})
}
render() { render() {
let cols = this.state.colFlag?columns:columns1;
return ( return (
<Table columns={columns} data={data} bordered/> <div>
<button onClick={this.onChange}>change列</button>
<Table columns={cols} data={data} bordered/>
</div>
); );
} }
} }

File diff suppressed because one or more lines are too long

2
dist/demo.css.map vendored

File diff suppressed because one or more lines are too long

217120
dist/demo.js vendored

File diff suppressed because one or more lines are too long

2
dist/demo.js.map vendored

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,6 @@
{ {
"name": "bee-table", "name": "bee-table",
"version": "2.0.24", "version": "2.0.25-beta.0",
"description": "Table ui component for react", "description": "Table ui component for react",
"keywords": [ "keywords": [
"react", "react",

View File

@ -237,7 +237,7 @@ class Table extends Component {
} }
// 是否传入 scroll中的y属性如果传入判断是否是整数如果是则进行比较 。bodyTable 的clientHeight进行判断 // 是否传入 scroll中的y属性如果传入判断是否是整数如果是则进行比较 。bodyTable 的clientHeight进行判断
// this.isShowScrollY(); this.isShowScrollY();
} }
componentWillUnmount() { componentWillUnmount() {
@ -313,7 +313,7 @@ class Table extends Component {
const bodyH = this.bodyTable.clientHeight; const bodyH = this.bodyTable.clientHeight;
const bodyContentH = this.bodyTable.querySelector('table').clientHeight; const bodyContentH = this.bodyTable.querySelector('table').clientHeight;
const rightBodyTable = this.refs.fixedColumnsBodyRight; const rightBodyTable = this.refs.fixedColumnsBodyRight;
const leftBodyTable = this.refs.fixedColumnsBodyLeft; // const leftBodyTable = this.refs.fixedColumnsBodyLeft;
const overflowy = bodyContentH <= bodyH ? 'auto':'scroll'; const overflowy = bodyContentH <= bodyH ? 'auto':'scroll';
this.bodyTable.style.overflowY = overflowy; this.bodyTable.style.overflowY = overflowy;