Блог

Я использую index в v-for, чтобы попытаться использовать его в функции для удаления этого элемента из массива. Индекс определен, но никогда не используется, появляется как ошибка из linter.

Я не уверен в правильном способе размещения индекса, поскольку именно так он указан в руководстве.

 <template>
    <div class="row">
        <app-quote v-for="(quote,index) in quotes" :key="quote.id" @click.native="deleteQuote">{{ quote }}</app-quote>

    </div>
</template>

<script>
import Quote from './Quote.vue';

export default {
    props: ['quotes'],
    components: {
        appQuote: Quote
    },
    methods: {
        deleteQuote(index) {
            this.$emit('quoteDeleted', index);
        }
    },
}
</script>
 

Вы можете передать индекс deleteQuote явно:

 <app-quote v-for="(quote, index) in quotes" :key="quote.id" @click.native="deleteQuote(index)">{{ quote }}</app-quote>
 

В общем, вы можете отключить линтер для строки:

 <!-- eslint-disable-next-line -->
 

Но в данном случае это не обязательно.