<template>
  <view class="main" :class="{ 'main-hidden': vdata.hidden }">
    <slot />
  </view>
</template>

<script setup>
import { reactive, provide } from 'vue'

const vdata = reactive({
  hidden: false,
})
const wrapperHidden = (e) => {
  return (vdata.hidden = e)
}
provide('wrapperHidden', wrapperHidden)
</script>

<style lang="scss" scoped>
.main {
  min-height: 100vh;
}
.main-hidden {
  height: 99vh;
  overflow: hidden;
}
</style>
