码迷,mamicode.com
首页 > 其他好文 > 详细

vue——2

时间:2020-01-20 22:38:07      阅读:93      评论:0      收藏:0      [点我收藏+]

标签:cli   name   ted   function   enter   ade   v-on   show   UNC   

<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

vue——2

标签:cli   name   ted   function   enter   ade   v-on   show   UNC   

原文地址:https://www.cnblogs.com/cl94/p/12219471.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!