<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>使用animate.css动画库控制vue.js过渡效果</title>
<script src="vue.js"></script>
<link rel="stylesheet" href="animate.css">
</head>
<body>
<div id="hdcms">
<button @click="type=!type">显示/隐藏</button>
<transition enter-active-class="animated fadeOutDown" leave-active-class="animated fadeInDown">
<h1 v-if="type">http://www.baidu.com百度一下就知道</h1>
</transition>
</div>
<script>
new Vue({
el: "#hdcms",
data:{
type:false
}
});
</script>
</body>
</html>
