Как реализовать удаление элемента из списка ToDo?

Question

[med1um]

Есть пример списка todo list: https://codesandbox.io/s/github/vuejs/vuejs.org/tr...

Вопрос: как добавить в него возможность удалять методом splice() элемент, на который кликнули средней кнопкой @click.middle ?

Если можно то с объяснением логики - куда именно добавлять обработчик и как передаются данные.

Comments

[Alex]

возможность удалять элемент, на который кликнули средней кнопкой

Плохая идея. Вы как бы говорите всем пользователям ноутбуков, планшетов, телефонов и т. д. "Идите нахрен".

[med1um]

Alex, а можно долгим нажатием реализовать?

[med1um]

Вобще, пока что ответы не по существу... Сейчас разбираюсь с тем как работает односторонняя привязка во Vue и как же всё таки удалять родительский элемент, когда клик произошёл по дочернему... клик неважно какой кнопкой - сделайте хоть левой кнопкой, хоть правой...

[Сергей Сергей]

на родительский элемент и повесить событие.

Метод для компонента tree-item

dropIt: function() {
  let list = this.$parent.item.children;
  let thisItem = this.item;
  list.splice( list.indexOf( thisItem ), 1 );
}

и обработчик рядом с другими кликами в див, который :class="{bold: isFolder}"
Суть, я думаю, понятна из текста метода.

Answer 1

[med1um]

Разобрался сам!

Из дочернего компонента нужно отправить событие в родительский компонент, при этом само событие можно назвать как угодно, например "delete-item":

<div @click.right="$emit('delete-item')" ...>

А на родительском компоненте нужно на данное событие повесить функцию-обработчик (назвать её например deleteItem()):

<tree-item @delete-item="deleteItem(index)" ...> , в которую передавать индекс (из for) удаляемого элемента, или можно использовать другой способ - вызвать код на месте так:

<tree-item @delete-item="item.children.splice(index, 1)" ...>

Answer 2

[Alex]

У вас массив? Вот и удаляйте как из массива https://developer.mozilla.org/uk/docs/Web/JavaScri...

Comments

[med1um]

То что splice() нужно применять это и так понятно) Вопрос в том где именно? Внутри какой функции?