vue.js if-else 与 v-show实例

最新推荐文章于 2022-09-07 17:48:59 发布

hlday6

最新推荐文章于 2022-09-07 17:48:59 发布

阅读量167

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/hlday6/article/details/118253306

版权

vue 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<head>

</head>

<body>
	<div id="mydiv">
		<h1 v-if="isShow">hello world</h1>
		<h1 v-else>other info</h1>

		<input type="button" value="隐藏Helloworld" v-on:click="hidehelloworld">

		<!-- v-show 用法-->
		<h1 v-show="isShow">v-show test hello world</h1>
		<h1 v-show="!isShow">v-show test other info</h1>

	</div>

	<script type="text/javascript" src="vue.js"></script>

	<script type="text/javascript">
		new Vue({
			el:"#mydiv",   //选择器
			data:{
				isShow:true,
			},

			methods:{
				hidehelloworld:function(){
					this.isShow = false;
				}
			}
		});
	</script>

</body>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

hlday6

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
vue.js if-else 与 v-show实例

<head></head><body> <div id="mydiv"> <h1 v-if="isShow">hello world</h1> <h1 v-else>other info</h1> <input type="button" value="隐藏Helloworld" v-on:click="hidehelloworld"> </div> &l.
复制链接

扫一扫