vue——2

Posted 2021-03-14 cl94

<div ref="hexad">
		 
</div>

vue操作dom
this.$refs.hexad.innerhtml = ‘nihao‘

vue动画

<template>
	<div id="demo">
		<button v-on:click="show = !show">
			Toogle
		</button>
		<transition name="fade">
			<p v-if="show">hello</p>
		</transition>
	</div>



</template>
<script>
	export default{
		data(){
			return {
				show: true,
			}
		},
		mounted :function() {
		
		},
		methods : {
			
		}

	}
</script>
<style>
	/* 显示 => 隐藏 */
	.fade-leave-active{
		transition: opacity 2s;
	}
	.fade-leave,.fade-enter-to{
		opacity: 1;
	}
	.fade-leave-to,.fade-enter{
		opacity: 0;
	}
	/* 隐藏 => 显示 */
	.fade-enter-active{
		transition: opacity 1s;
	}
</style>

　　https://www.cnblogs.com/fxwoniu/p/11359273.html