Vue基础--条件渲染

最新推荐文章于 2023-12-11 15:37:15 发布

长耳朵的鱼鱼

最新推荐文章于 2023-12-11 15:37:15 发布

阅读量91

点赞数

分类专栏： Vue学习笔记

本文链接：https://blog.csdn.net/weixin_43847545/article/details/105500090

版权

Vue学习笔记专栏收录该内容

6 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>条件渲染</title>
		<script src="../js/vue.js"></script>
	</head>
	<body>
		<div id="demo">
			<p v-if="ok">
				成功了
			</p>
			<p v-else>
				失败了
			</p>
			<p v-show="ok">hha success</p>
			<p v-show="!ok">fail</p>
			<button @click="ok=!ok">change</button>
		</div>
	</body>
	<script>
		//v-if 和v-show的区别  v-if不显示element是直接移除,v-show是添加display:none的style,在需要频繁刷新的情况下使用v-show,
		new Vue({
			el:"#demo",
			data:{
				ok:true
			}
		})
		
	</script>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

长耳朵的鱼鱼

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Vue基础--条件渲染

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>条件渲染</title> <script src="../js/vue.js"></script> </head> <body> <...
复制链接

扫一扫