Table: add row-dblclick event.

This commit is contained in:
Furybean 2016-12-02 17:11:04 +08:00 committed by 杨奕
parent e2870f72f0
commit 0caa085523
4 changed files with 22 additions and 0 deletions

View File

@ -1198,6 +1198,7 @@ Customize table column so it can be integrated with other components.
| cell-mouse-leave | triggers when hovering out of a cell | row, column, cell, event | | cell-mouse-leave | triggers when hovering out of a cell | row, column, cell, event |
| cell-click | triggers when clicking a cell | row, column, cell, event | | cell-click | triggers when clicking a cell | row, column, cell, event |
| row-click | triggers when clicking a row | row, event | | row-click | triggers when clicking a row | row, event |
| row-dblclick | triggers when double clicking a row | row, event |
| header-click | triggers when clicking a column header | column, event | | header-click | triggers when clicking a column header | column, event |
| sort-change | triggers when Table's sorting changes | { column, prop, order } | | sort-change | triggers when Table's sorting changes | { column, prop, order } |
| current-change | triggers when current row changes | currentRow, oldCurrentRow | | current-change | triggers when current row changes | currentRow, oldCurrentRow |

View File

@ -1207,6 +1207,7 @@
| cell-mouse-leave | 当单元格 hover 退出时会触发该事件 | row, column, cell, event | | cell-mouse-leave | 当单元格 hover 退出时会触发该事件 | row, column, cell, event |
| cell-click | 当某个单元格被点击时会触发该事件 | row, column, cell, event | | cell-click | 当某个单元格被点击时会触发该事件 | row, column, cell, event |
| row-click | 当某一行被点击时会触发该事件 | row, event | | row-click | 当某一行被点击时会触发该事件 | row, event |
| row-dblclick | 当某一行被双击时会触发该事件 | row, event |
| header-click | 当某一列的表头被点击时会触发该事件 | column, event | | header-click | 当某一列的表头被点击时会触发该事件 | column, event |
| sort-change | 当表格的排序条件发生变化的时候会触发该事件 | { column, prop, order } | | sort-change | 当表格的排序条件发生变化的时候会触发该事件 | { column, prop, order } |
| current-change | 当表格的当前行发生变化的时候会触发该事件,如果要高亮当前行,请打开表格的 highlight-current-row 属性 | currentRow, oldCurrentRow | | current-change | 当表格的当前行发生变化的时候会触发该事件,如果要高亮当前行,请打开表格的 highlight-current-row 属性 | currentRow, oldCurrentRow |

View File

@ -36,6 +36,7 @@ export default {
<tr <tr
style={ this.rowStyle ? this.getRowStyle(row, $index) : null } style={ this.rowStyle ? this.getRowStyle(row, $index) : null }
key={ this.$parent.rowKey ? this.getKeyOfRow(row, $index) : $index } key={ this.$parent.rowKey ? this.getKeyOfRow(row, $index) : $index }
on-dblclick={ ($event) => this.handleDoubleClick($event, row) }
on-click={ ($event) => this.handleClick($event, row) } on-click={ ($event) => this.handleClick($event, row) }
on-mouseenter={ _ => this.handleMouseEnter($index) } on-mouseenter={ _ => this.handleMouseEnter($index) }
on-mouseleave={ _ => this.handleMouseLeave() } on-mouseleave={ _ => this.handleMouseLeave() }
@ -195,6 +196,11 @@ export default {
this.store.commit('setHoverRow', null); this.store.commit('setHoverRow', null);
}, },
handleDoubleClick(event, row) {
const table = this.$parent;
table.$emit('row-dblclick', row, event);
},
handleClick(event, row) { handleClick(event, row) {
const table = this.$parent; const table = this.$parent;
const cell = getCell(event); const cell = getCell(event);

View File

@ -399,6 +399,20 @@ describe('Table', () => {
}, DELAY); }, DELAY);
}); });
it('row-dblclick', done => {
const vm = createTable('row-dblclick');
setTimeout(_ => {
const cell = vm.$el.querySelectorAll('.el-table__body .cell')[2]; // first row
triggerEvent(cell.parentNode.parentNode, 'dblclick');
expect(vm.result).to.length(2); // row, event
expect(vm.result[0]).to.have.property('name').to.equal(getTestData()[0].name);
destroyVM(vm);
done();
}, DELAY);
});
it('current-change', done => { it('current-change', done => {
const vm = createTable('current-change'); const vm = createTable('current-change');