Sheet

import {Sheet} from '@gravity-ui/uikit';

Sheet 是专为在移动环境中用作信息或交互元素而设计的组件。您可以将任何大小的内容放入其中，因为支持内部滚动和动态调整大小。

在移动设备上，您可以 Sheet 通过拉动其主要部分或滑动区域来移动。要将其关闭，请向下滑动或点按外部区域 Sheet。

§用法

import React from 'react';
import {Button, Sheet} from '@gravity-ui/uikit';

const SheetExample = () => {
  const [visible, setVisible] = React.useState(false);

  return (
    <React.Fragment>
      <Button onClick={() => setVisible(true)}>Open Sheet</Button>
      <Sheet visible={visible} onClose={() => setVisible(false)} title="Content Sheet">
        Content
      </Sheet>
    </React.Fragment>
  );
};

§属性

§CSS API