Vue2: изменить данные внутри цикла v-for

Question

У меня есть следующий цикл, который отображает изображения в галерее:

<a href="#" v-for="(file, index) in files" v-bind:key="file.id" @click="file.selected = !file.selected">
    <img :src="file.url" />
    <span>{{file.name}}</span>
    <i v-show="file.selected" class="fa fa-check-square"></i>
</a>

Я хотел бы иметь возможность выбрать любое изображение, нажав на него.Но ничего не происходит, когда я нажимаю на изображение.Я сделал это так, как сделал бы это в AngularJs - я изменяю элемент внутри цикла.

Я ожидал, что: - представление (внутри цикла) будет обновлено - изменение элемента будетбыть перенесенным в массив данных (файлы)

Answer 1

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