vue项目的transition动画

1. 实现页面动画进入时右滑，离开时左滑。

<template>
	<transition name="slide">
		<div class="singer_detail">
		
		</div>
	</transition>	
</template>
<style>
.singer_detail{
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: #222;
	z-index: 100;
}
.slide-enter-active{  //动画执行的时间
	transition: all 0.3s;
}
.slide-enter,.slide-leave-to{  //进入和离开时的动画
	transform: translate3d(100%,0,0);
}
</style>