Flyout 是一个用于渲染浮动内容模态框的组件。它的用途类似于工具提示，但可以渲染各种类型的内容，而不仅仅是简单文本。
用法
import { Button, __experimentalFlyout as Flyout, __experimentalText as Text } from '@wordpress/components';
function Example() {
return (
<Flyout trigger={ <Button>Show/Hide content</Button> }>
<Text>Code is Poetry</Text>
</Flyout>
);
}属性
state: PopoverStateReturn
- 必需：否
label: string
- 必需：否
animated: boolean
确定 Flyout 是否具有动画效果。
- 必需：否
- 默认值：
true
animationDuration: boolean
Flyout 动画的持续时间。
- 必需：否
- 默认值：
160
baseId: string
将作为所有项 ID 基础使用的 ID。参见 https://reakit.io/docs/popover/#usepopoverstate
- 必需：否
- 默认值：
160
elevation: number
阴影的高度大小。更多信息，请查看 Card。
- 必需：否
- 默认值：
5
maxWidth: CSSProperties[ ‘maxWidth’ ]
Flyout 元素的最大宽度。
- 必需：否
- 默认值：
360
onVisibleChange: ( …args: any ) => void
当 visible 状态发生变化时的回调函数。
- 必需：否
trigger: FunctionComponentElement< any >
点击时触发 Flyout visible 状态的元素。
<Flyout trigger={<Button>Greet</Button>}>
<Text>Hi! I'm Olaf!</Text>
</Flyout>- 必需：是
visible: boolean
是否显示 Flyout。有关更多信息，请参阅 Reakit 文档。
- 必需：否
- 默认值：
false
placement: PopperPlacement
弹出层元素的位置。有关更多信息，请参阅 popper 文档。
- 必需：否
- 默认值：
auto