Как во вью повесить обработчик событий в зависимости от проверки?

Question

[billt]

Есть таблица, мне нужно по нажатию tab в последнем td вызывать метод, td рендерятся через v-for, как повесить нужный момент на нужный td?

Answer 1

[Alexander]

Первое что пришло в голову, но думаю есть и более эффективный вариант.

<table class="table">
	<tr>
		<td v-for="(user, index) in users" v-if="index !== users.length - 1">{{ user.name }}</td>		
		<td v-for="(user, index) in users" v-if="index === users.length - 1" @click="tabAction">{{ user.name }}</td>
	</tr>
</table>

UPD: ну или вынести в метод проверку, чтобы не засорять условиями шаблон
Но вообще там ниже 0xD34F предложил решение получше =)

<td v-for="(user, index) in users" v-if="!isThisLastIndex(users, index)">{{ user.name }}</td>		
<td v-for="(user, index) in users" v-if="isThisLastIndex(users, index)" @click="tabAction">{{ user.name }}</td>
...

isThisLastIndex(users, index) {
	return index === users.length - 1
}

Answer 2

[0xD34F]

<td v-for="(n, i) in row">
  <input @keydown.tab="i === row.length - 1 ? onTab(n) : null">
</td>

https://jsfiddle.net/qrnh9s47/

Answer 3

[ой всё]

если вы не поленитесь каждому элементу сгенерировать уникальный id, то у вас никогда не будет проблем обратиться к любому элементу в любое время по любому событию, а ваш html код будет девственно чист и не забит вот этим всем мусором

Comments

[billt]

Каким мусором?

[ой всё]

billt, все, что не относится к html

[billt]

ой всё, а лучше что бы в таблице где больше 500 td, каждый из них был с уникальным id?

[ой всё]

billt, у меня в форме от 800 до 1000+ id
и такую форму со всеми перделками и свистелками включая две сотни правил бизнес валидации я собираю за один день
сколько времени уйдет у вас, если вы будете писать js код в каждом тэге?

Answer 4

[planc]

google:
vue if last child

https://stackoverflow.com/a/41629937/5671005

по аналогии биндим функцию или null