uni-app 第七章：条件渲染

最新推荐文章于 2024-06-22 18:37:57 发布

原创最新推荐文章于 2024-06-22 18:37:57 发布 · 266 阅读

0 ·

CC 4.0 BY-SA版权

uni-app 专栏收录该内容

11 篇文章

订阅专栏

<template>
	<view>
		<template v-if="isShow">
		<view class="box" >
		我是第一个秋秋，
		</view>
		</template>
		<template v-else>
		<view class="box" >
		我是第二个秋秋，
		</view>
		</template>
<button type="default" @tap="isShowFun()">显示和隐藏</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isShow:true
			}
		},
		methods: {
			isShowFun:function(){
				this.isShow=!this.isShow;
			}
		}
	}
</script>

<style>
 .box{
	height: 500upx;
width: 500upx;
	display: flex;
	border-radius:100%;
	border: 1upx solid #CCCCCC;
		background-color: #0A98D5;
}

</style>