Roku UI

Fullscreen Overlay / 全屏遮罩

全屏遮罩组件。它和 Overlay 组件的区别在于,它会覆盖整个屏幕,而不是覆盖在某个元素上。Modal 和 Drawer 组件都基于它。

特性

支持各种颜色、透明度、特效等配置。

基础用法

<script setup>
import { ref } from 'vue'
import { Btn, FullscreenOverlay } from '@roku-ui/vue'
const show = ref(false)
</script>
<template>
  <Btn @click="show = true">
    Open Fullscreen Overlay
  </Btn>
  <FullscreenOverlay v-model="show" />
</template>