Как вывести текущий индекс во vue?

Question

[Маленький Вася]

Вообщем имеется 2 компонента modal.vue и content.vue.
В content.vue реализовано v-for, который выводит мне список картинок с заголовками, при нажатии на картинку всплывает modal.vue ( модальнок окно ), но модальное окно инициализирует весь массив..
Вопрос... как вывести текущий индекс?

<div class="col-md-4" v-for="(item, index) in starsItem" :key="item.id" :index="index">
                    <!-- Модальное окно -->
                    <popup v-if="showModal" @close="showModal = false" 
                    :img='item.itemImg'>
                    </popup>
                    
                    <div class="item">
                        <div class="img">
                            <img :src="item.itemImg" class="img-responsive" alt="">
                            <span class="price">{{item.price + ' сом'}}</span>
                            <div class="eye" @click="parent()">
                                <i class="fas fa-search-plus"></i>
                            </div>
                            <span class="id">{{'ID ' + item.itemId}}</span>
                        </div>

                       ....

Answer 1

[0xD34F]

Выносите popup из div'а c v-for'ом; вместо showModal пусть будет свойство, представляющее выбранный элемент, selectedItem, например. Используете его в v-if'е вашего popup'а, его же передаёте в popup (вместо item.itemImg). Выглядеть это всё может примерно так.