Я использую VUE для анимации слайдера (список изображений).Есть два / три слайда, каждый из которых состоит максимум из 9 изображений.У меня есть вычисленное свойство slide
, которое возвращает текущий набор изображений.Есть еще одно свойство start
, которое обозначает номер первого изображения текущего слайда.Элемент <ul>
является прямым потомком <transition>
, поэтому анимация происходит только при изменении ключа <ul>
.Первый фрагмент - это то, как я хотел бы решить проблему.Это работает, но я не могу найти никакой информации, если можно использовать свойство: key для элемента без цикла v-for.
Как проблема была решена до сих пор?Там было две петли v-for.Свойство вычисляемого слайда вернуло [слайд] и искусственно зациклило одноэлементную таблицу.Проблема, которую я вижу, состоит в том, что циклы v-for воспринимают все объекты как: ключ, а это не то, что рекомендует документация.Второй фрагмент - это то, как код выглядит прямо сейчас.
<transition>
<ul :key="this.start">
<li v-for="image in slide" :key="image.id">
<a>
<img />
</a>
</li>
</ul>
</transition>
<!--CURRENTLY-->
<transition>
<ul v-for="slide in slides" :key="slide">
<li v-for="image in slide" :key="image">
<a>
<img />
</a>
</li>
</ul>
</transition>