请问老师leave为什么不起效

<template>
	<div>
		<div id="demo">
			<button @click='show=!show'>toggle</button>
			<transition name="fade">
				<div  class="j1" v-if="show">show</div>
			</transition>	
		</div>
	</div>
</template>
<script>
	export default{
		data(){
			return{
				'show':true
			}
		}
	}
</script>
<style>
.fade-leave{
		font-size: 45px;
	}
	.fade-leave-active,.fade-enter-active{
		transition:all 2s;
	}
	.fade-leave-to,.fade-enter{
		font-size: 45px;
	}

</style>

请问老师，点击toggle的时候为什么.fade-leave{font-size: 45px;}没起效果