Vue. js переход и использование GSAP3 Stagger - PullRequest
Новая
       43

Vue. js переход и использование GSAP3 Stagger

1 голос
/ 22 апреля 2020

Я использую Vue. js и gsap для перечисления элементов карты, но он не анимирует один за другим. Вот это Vue. js коды: 

<transition-group appear @before-enter="beforeEnter" @enter="enter" :css="false">
  <div class="card" v-for="card in cards" :key="card.id">
    <span>{{ card.name }}</span>
  </div>
</transition-group>

vue js и части gsap: 

beforeEnter(el) {
  console.log(el);
  gsap.from(el, {
    duration: 1
    opacity:0,
    ease: "power2.inOut",
    stagger: {
      grid: "auto",
      from: "start",
      amount: 1.5
    }
  })
},
enter(el, done) {
  gsap.to(el, {
    duration: 1,
    opacity: 1
  })
}

Анимация работает, но все перечисляются одновременно , Я хочу быть в списке один за другим

...