JavaScript
/
bee-table
3
0
Fork 1
Code Issues Pull Requests Releases Wiki Activity

componentDidMount 获取不到querySelector

This commit is contained in:
jonyshi 2019-04-22 16:02:32 +08:00
parent 9d91636050
commit 5397fb9756
4 changed files with 98 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
build/TableHeader.js
View File

@ -449,6 +449,16 @@ var TableHeader = function (_Component) {
document.querySelector("body").appendChild(div);
};
TableHeader.prototype.componentWillUnmount = function componentWillUnmount() {
if (!this.table) return;
if (this.props.draggable) {
this.removeDragAbleEvent();
}
if (this.props.dragborder) {
this.removeDragBorderEvent();
}
};
/**
* 获取table的属性存放在this.table 中。(公用方法)
* @returns
@ -514,6 +524,16 @@ var TableHeader = function (_Component) {
this.eventListen(events, '', this.table.tr[0]); //表示把事件添加到th元素上
};
/**
* 删除拖动改变列宽的事件监听
*/
TableHeader.prototype.removeDragBorderEvent = function removeDragBorderEvent() {
var events = [{ key: 'mouseup', fun: this.onTrMouseUp }, { key: 'mousemove', fun: this.onTrMouseMove }, { key: 'mousedown', fun: this.onTrMouseDown }];
this.eventListen(events, 'remove', this.table.tr[0]);
};
TableHeader.prototype.eventListen = function eventListen(events, type, eventSource) {
var tr = this.table.tr;
@ -593,6 +613,16 @@ var TableHeader = function (_Component) {
this.eventListen(events, '', this.table.tr[0]); //表示把事件添加到th元素上
};
/**
* 删除换列的事件监听
*/
TableHeader.prototype.removeDragAbleEvent = function removeDragAbleEvent() {
var events = [{ key: 'dragstart', fun: this.onDragStart }, { key: 'dragover', fun: this.onDragOver }, { key: 'drop', fun: this.onDrop }, { key: 'dragenter', fun: this.onDragEnter }, { key: 'dragend', fun: this.onDragEnd }, { key: 'dragleave', fun: this.onDragLeave }];
this.eventListen(events, 'remove', this.table.tr[0]);
};
/**
* 开始调整交换列的事件
*/

30
dist/demo.js vendored
View File

@ -44521,6 +44521,16 @@
document.querySelector("body").appendChild(div);
};
TableHeader.prototype.componentWillUnmount = function componentWillUnmount() {
if (!this.table) return;
if (this.props.draggable) {
this.removeDragAbleEvent();
}
if (this.props.dragborder) {
this.removeDragBorderEvent();
}
};
/**
* 获取table的属性存放在this.table 中。(公用方法)
* @returns
@ -44586,6 +44596,16 @@
this.eventListen(events, '', this.table.tr[0]); //表示把事件添加到th元素上
};
/**
* 删除拖动改变列宽的事件监听
*/
TableHeader.prototype.removeDragBorderEvent = function removeDragBorderEvent() {
var events = [{ key: 'mouseup', fun: this.onTrMouseUp }, { key: 'mousemove', fun: this.onTrMouseMove }, { key: 'mousedown', fun: this.onTrMouseDown }];
this.eventListen(events, 'remove', this.table.tr[0]);
};
TableHeader.prototype.eventListen = function eventListen(events, type, eventSource) {
var tr = this.table.tr;
@ -44665,6 +44685,16 @@
this.eventListen(events, '', this.table.tr[0]); //表示把事件添加到th元素上
};
/**
* 删除换列的事件监听
*/
TableHeader.prototype.removeDragAbleEvent = function removeDragAbleEvent() {
var events = [{ key: 'dragstart', fun: this.onDragStart }, { key: 'dragover', fun: this.onDragOver }, { key: 'drop', fun: this.onDrop }, { key: 'dragenter', fun: this.onDragEnter }, { key: 'dragend', fun: this.onDragEnd }, { key: 'dragleave', fun: this.onDragLeave }];
this.eventListen(events, 'remove', this.table.tr[0]);
};
/**
* 开始调整交换列的事件
*/

2
dist/demo.js.map vendored
View File

File diff suppressed because one or more lines are too long

40
src/TableHeader.js
View File

@ -35,11 +35,9 @@ class TableHeader extends Component {
contentWidthDiff: 0
};
componentDidUpdate(){
this.initTable();
this.initEvent();
}
componentDidMount(){
@ -49,6 +47,15 @@ class TableHeader extends Component {
document.querySelector("body").appendChild(div);
}
componentWillUnmount(){
if(!this.table)return;
if (this.props.draggable){
this.removeDragAbleEvent();
}
if(this.props.dragborder){
this.removeDragBorderEvent();
}
}
/**
* 获取table的属性存放在this.table 中。(公用方法)
@ -75,7 +82,6 @@ class TableHeader extends Component {
table.fixedRightBodyTable = contentTable.querySelector('.u-table-fixed-right .u-table-body-outer') ;
table.innerTableBody= contentTable.querySelector('.u-table-scroll .u-table-body table');
this.table = table;
if(!this.props.dragborder)return;
@ -113,6 +119,19 @@ class TableHeader extends Component {
this.eventListen(events,'',this.table.tr[0]);//表示把事件添加到th元素上
}
/**
* 删除拖动改变列宽的事件监听
*/
removeDragBorderEvent(){
let events = [
{key:'mouseup', fun:this.onTrMouseUp},
{key:'mousemove', fun:this.onTrMouseMove},
{key:'mousedown', fun:this.onTrMouseDown}
];
this.eventListen(events,'remove',this.table.tr[0]);
}
eventListen(events,type,eventSource){
let {tr} = this.table;
@ -335,6 +354,21 @@ class TableHeader extends Component {
this.eventListen(events,'',this.table.tr[0]);//表示把事件添加到th元素上
}
/**
* 删除换列的事件监听
*/
removeDragAbleEvent(){
let events = [
{key:'dragstart',fun:this.onDragStart},
{key:'dragover', fun:this.onDragOver},
{key:'drop', fun:this.onDrop},
{key:'dragenter', fun:this.onDragEnter},
{key:'dragend', fun:this.onDragEnd},
{key:'dragleave', fun:this.onDragLeave},
];
this.eventListen(events,'remove',this.table.tr[0]);
}
/**
* 开始调整交换列的事件
*/