vue transition标签使用Animate.css动画

vue transition标签使用Animate.css动画库

安装
使用 npm 安装

npm install animate.css --save

使用yarn安装

yarn add animate.css

main.js导入

import "animate.css"

页面

<template>
	<div id="app">
		<button @click="show = !show">隐藏/显示</button>
		<transition
			name="custom-classes-transition"
			enter-active-class="animate__animated animate__bounce"
			leave-active-class="animate__animated animate__zoomOut"
		>
			<p v-if="show">hello word,I love China</p>
		</transition>
	</div>
</template>
<script>
export default {
	data() {
		return {
			show: true,
		}
	},
}
</script>
<style scoped>
</style>