VUE----v-show实现点击出现，再点击隐藏

核心思想：

绑定点击事件，默认show变量为false，一旦有e事件，判断当前的页面是否为ture，如果是true，让变量改为false，如果为false，改为true实现。

HTML:

<template>
    <view>
        <view class="quanbu" @click="zhankai1" >
			<text>展开/隐藏</text>
        </view>
		<view class="diqu" v-show="xianshi">
			
		</view>
    </view>
</template>

JS：

<script>
    export default {
        data() {
            return {
              xianshi:false,
            }
        },
        methods: {
        zhankai1(e){
        	if(this.xianshi==true){
        		this.xianshi=false
        	}else if(this.xianshi==false){
        		this.xianshi=true
        	}
        }
        }
    }
</script>

CSS：

<style>
   .quanbu {
   	width: 130rpx;
   	height: 52rpx;
   	border-radius: 50rpx;
   	background-color: #eaeaea;
   	display: flex;
   	justify-content: center;
   	align-items: center;
   	margin: 24rpx;
   	font-size: 26rpx;
   	color: #323232;
   }
   .diqu{
   	width: 100%;
   	height: 750rpx;
   	background-color: #00C545;
   	position: fixed;
   	top: 260rpx;
   	z-index: 3;
   }
</style>