Backdrop 背景板

import { Backdrop } from "@taroify/core"

import { Backdrop, Button } from "@taroify/core"

function BackdropExample() {
  const [open, setOpen] = useState(false)
  return <>
    <Button onClick={() => setOpen(true)}>显示背景板</Button>
    <Backdrop
      open={open} closeable
      onClose={() => setOpen(false)}
    />
  </>
}

import { Backdrop, Button } from "@taroify/core"

function BackdropExample() {
  const [open, setOpen] = useState(false)
  return <>
    <Button onClick={() => setOpen(true)}>嵌入内容</Button>
    <Backdrop open={open} closeable onClose={() => setOpen(false)}>
      <View className="content-wrapper">
        <View className="content-block" />
      </View>
    </Backdrop>
  </>
}

.content-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.content-block {
  width: 60px * 2;
  height: 60px * 2;
  background-color: #fff;
}