vue-cli 使用animate.css最简单的方法
1.npm install animate.css2.在main.js引入 import animate from 'animate.css'Vue.use(animate);<template><transition name="zoom"><slot></slot>
·
1.npm install animate.css
2.在main.js引入
import animate from 'animate.css'
Vue.use(animate);
<template>
<transition name="zoom">
<slot></slot>
</transition>
</template>
<script>
export default {
name:'FadeAnimation'
}
</script>
<style scoped>
.zoom-enter-active{
animation :zoomIn .5s
}
.zoom-leave-active{
animation :zoomOut .5s
}
</style>
3.使用方式
封装好组件并
<fade-animation>
<common-gallary
:imgs="bannerImgs"
v-show="showGallary"
@close="handleGallaryClose"
></common-gallary>
</fade-animation>
更多推荐
已为社区贡献2条内容
所有评论(0)