vue的v_if

最新推荐文章于 2024-07-19 10:04:44 发布

原创最新推荐文章于 2024-07-19 10:04:44 发布 · 212 阅读

0 ·

CC 4.0 BY-SA版权

vuejs 专栏收录该内容

34 篇文章

订阅专栏

本文通过一个简单的Vue实例展示了如何使用v-if指令进行条件渲染。该示例包括了基本的真值判断、布尔值判断以及表达式的使用。通过不同的条件设置，页面上的元素将被选择性地显示或隐藏。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
				<script type="text/javascript" src="vue1.0.25.js" ></script>

	</head>
	<body>
		<div id="app">
	
			<p v-if='show'>要显示出来</p>
		 <p v-if='hide'>不要显示出来</p>
		 <p v-if="height>180">小明身高{{height}}</p>
		</div>
		<script type="text/javascript">
			new Vue({
				el:'#app',
				data:{
					show:true,
					hide:false,
					height:170
				}
			})
		</script>
	</body>
</html>