+
产品梦工厂一家公司全部帮您搞定，减少供应商数
量就能防止供应商
扯皮/推诿帮您省心省力还能帮
您 节省30%
diff --git a/src/views/Index/index.vue b/src/views/Index/index.vue
index e425fdf..84659dd 100644
--- a/src/views/Index/index.vue
+++ b/src/views/Index/index.vue
@@ -108,9 +108,31 @@ export default {
const swiperStore = useSwiperStore()
swiperStore.initSwiper(swiper)
swiperStore.updateActiveIndex(activeIndex)
+ // add animate to some ele
+ animateCSS('#a', 'bounce')
}
+ const animateCSS = (element, animation, prefix = 'animate__') =>
+ // We create a Promise and return it
+ new Promise((resolve, reject) => {
+ const animationName = `${prefix}${animation}`
+ const node = document.querySelector(element)
+
+ node?.classList.add(`${prefix}animated`, animationName)
+
+ // When the animation ends, we clean the classes and resolve the Promise
+ function handleAnimationEnd(event) {
+ event.stopPropagation()
+ node?.classList.remove(`${prefix}animated`, animationName)
+ resolve('Animation ended')
+ }
+
+ node?.addEventListener('animationend', handleAnimationEnd, {
+ once: true,
+ })
+ })
return {
onSwiper,
+ animateCSS,
onSlideChange,
pagination: {
clickable: true,