除非你需要对单个选择进行昂贵的操作,否则你可以将rowSelect重构为toggle。设置一个简单的数组会比设置和取消定时器更快、更可靠、更直接。如果点击事件触发两次,这并不重要,但你可以在edit函数中轻松处理它。
<template>
<ul>
<li :key="index" v-for="(item, index) in items">
<a
:class="{ 'active-class': selected.indexOf(item) !== -1 }"
@click="toggleSelect(item)"
@dblclick="editItem(item)"
>
{{ item.title }}
</a>
</li>
</ul>
</template>
<script>
export default {
data: function () {
return {
items: [
{
id: 1,
title: "Item 1",
},
{
id: 2,
title: "Item 2",
},
{
id: 3,
title: "Item 3",
},
],
selected: [],
};
},
methods: {
editItem(item) {
this.doTheThingThatOpensTheEditorHere(item);
},
toggleSelect(item) {
let index = this.selected.indexOf(item.id);
index === -1
? this.selected.push(item.id)
: this.selected.splice(index, 1);
},
getSelected() {
return this.items.filter((item) => this.selected.indexOf(item.id) !== -1);
},
},
};
</script>
@dblclick.stop="showEditForm(row,$event)"
的翻译是什么? - Belmin Bedak