Sheet

移动端底部抽屉/抽屉组件。

导入

import { Sheet } from '@xcloud/ui-mobile/sheet'

基础用法

import { Sheet } from '@xcloud/ui-mobile/sheet'

function App() {
  const [open, setOpen] = useState(false)

  return (
    <>
      <button onClick={() => setOpen(true)}>Open Sheet</button>
      <Sheet open={open} onOpenChange={setOpen}>
        <Sheet.Content>
          <Sheet.Header>
            <Sheet.Title>Title</Sheet.Title>
          </Sheet.Header>
          <div>Content goes here</div>
        </Sheet.Content>
      </Sheet>
    </>
  )
}

属性

属性	类型	默认值	描述
open	boolean	必需	打开状态
onOpenChange	(open: boolean) => void	必需	状态变化处理器
children	ReactNode	必需	抽屉内容