Skip to content

Commit d0e1084

Browse files
ziyounglzq4047
authored andcommitted
Table: fix setCurrentRow unable to clear highlight row (ElemeFE#16879)
1 parent 321c21c commit d0e1084

File tree

3 files changed

+63
-21
lines changed

3 files changed

+63
-21
lines changed

packages/table/src/store/current.js

Lines changed: 27 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -35,34 +35,41 @@ export default {
3535
},
3636

3737
updateCurrentRow(currentRow) {
38+
const { states, table } = this;
39+
const oldCurrentRow = states.currentRow;
40+
if (currentRow && currentRow !== oldCurrentRow) {
41+
states.currentRow = currentRow;
42+
table.$emit('current-change', currentRow, oldCurrentRow);
43+
return;
44+
}
45+
if (!currentRow && oldCurrentRow) {
46+
states.currentRow = null;
47+
table.$emit('current-change', null, oldCurrentRow);
48+
}
49+
},
50+
51+
updateCurrentRowData() {
3852
const { states, table } = this;
3953
const { rowKey, _currentRowKey } = states;
4054
// data 为 null 时,结构时的默认值会被忽略
4155
const data = states.data || [];
4256
const oldCurrentRow = states.currentRow;
4357

44-
if (currentRow) {
45-
this.restoreCurrentRowKey();
46-
states.currentRow = currentRow;
47-
if (oldCurrentRow !== currentRow) {
48-
this.table.$emit('current-change', currentRow, oldCurrentRow);
58+
// 当 currentRow 不在 data 中时尝试更新数据
59+
if (data.indexOf(oldCurrentRow) === -1 && oldCurrentRow) {
60+
if (rowKey) {
61+
const currentRowKey = getRowIdentity(oldCurrentRow, rowKey);
62+
this.setCurrentRowByKey(currentRowKey);
63+
} else {
64+
states.currentRow = null;
4965
}
50-
} else {
51-
// 当 currentRow 不在 data 中时尝试更新数据
52-
if (data.indexOf(oldCurrentRow) === -1 && oldCurrentRow) {
53-
this.restoreCurrentRowKey();
54-
if (rowKey) {
55-
const currentRowKey = getRowIdentity(oldCurrentRow, rowKey);
56-
this.setCurrentRowByKey(currentRowKey);
57-
} else {
58-
states.currentRow = null;
59-
}
60-
if (states.currentRow !== oldCurrentRow) {
61-
table.$emit('current-change', null, oldCurrentRow);
62-
}
63-
} else if (_currentRowKey) {
64-
this.setCurrentRowByKey(_currentRowKey);
66+
if (states.currentRow === null) {
67+
table.$emit('current-change', null, oldCurrentRow);
6568
}
69+
} else if (_currentRowKey) {
70+
// 把初始时下设置的 rowKey 转化成 rowData
71+
this.setCurrentRowByKey(_currentRowKey);
72+
this.restoreCurrentRowKey();
6673
}
6774
}
6875
}

packages/table/src/store/index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ Watcher.prototype.mutations = {
1010
this.execQuery();
1111
// 数据变化,更新部分数据。
1212
// 没有使用 computed,而是手动更新部分数据 https://github.com/vuejs/vue/issues/6660#issuecomment-331417140
13-
this.updateCurrentRow();
13+
this.updateCurrentRowData();
1414
this.updateExpandRows();
1515
if (states.reserveSelection) {
1616
this.assertRowKey();

test/unit/specs/table.spec.js

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1843,6 +1843,41 @@ describe('Table', () => {
18431843
assertSortIconCount(vm.$el, 'sorting icon is not one after sort same column');
18441844
destroyVM(vm);
18451845
});
1846+
1847+
it('setCurrentRow', async() => {
1848+
const vm = createVue({
1849+
template: `
1850+
<div>
1851+
<el-table ref="table" :data="testData" highlight-current-row>
1852+
<el-table-column prop="name" sortable />
1853+
<el-table-column prop="release" sortable />
1854+
<el-table-column prop="director" sortable />
1855+
<el-table-column prop="runtime" sortable />
1856+
</el-table>
1857+
<button class="clear" @click="clear">clear</button>
1858+
</div>
1859+
`,
1860+
data() {
1861+
return { testData: getTestData() };
1862+
},
1863+
methods: {
1864+
clear() {
1865+
this.$refs.table.setCurrentRow();
1866+
}
1867+
}
1868+
});
1869+
1870+
vm.$refs.table.setCurrentRow(vm.testData[1]);
1871+
await waitImmediate();
1872+
const secondRow = vm.$el.querySelectorAll('.el-table__row')[1];
1873+
expect(secondRow.classList.contains('current-row')).to.true;
1874+
1875+
vm.$el.querySelector('.clear').click();
1876+
await waitImmediate();
1877+
expect(secondRow.classList.contains('current-row')).to.false;
1878+
1879+
destroyVM(vm);
1880+
});
18461881
});
18471882

18481883
it('hover', async() => {

0 commit comments

Comments
 (0)