t-popover

Popover 气泡弹出框

组件介绍

t-popover 是气泡框组件，点击后显示弹出内容，支持配置弹出位置、动画效果等。

平台兼容

Harmony	H5	Android	iOS	小程序	UTS
✅	✅	✅	✅	✅	✅

基础用法

基础用法参考 demo/popover/popover.uvue，通过插槽配置触发按钮和弹出内容。

<template>
  <t-popover placement="bottom">
    <template #button>
      <t-button>点击弹出</t-button>
    </template>
    <t-cell>选项一</t-cell>
    <t-cell>选项二</t-cell>
    <t-cell>选项三</t-cell>
  </t-popover>
</template>

Props

属性名	说明	类型	默认值
placement	弹出框位置	string	'bottom'
animationType	展开动画类型，0 不带缩放，1 带缩放	number	1
maskClass	遮罩层样式	string	-
menuClass	菜单样式	string	-
contentBoxClass	内容区样式	string	-
contentClass	内容区滚动样式	string	-
tipsClass	指示三角的样式	string	-
path	点击组件后跳转的页面路径	string	''
hover	是否启用点击效果	boolean	false
type	组件主题类型	string	'primary'
disabled	是否禁用	boolean	false
effect	组件显示主题	string	'normal'
size	组件尺寸	string	-

placement 可选值

值	说明
bottom	显示在下方中间对齐
bottom-start	显示在下方左边对齐
bottom-end	显示在下方右边对齐
right	显示在右边中间对齐
right-start	显示在右边上边对齐
right-end	显示在右边下边对齐
left	显示在左边中间对齐
left-start	显示在左边上边对齐
left-end	显示在左边下边对齐
top	显示在上方中间对齐
top-start	显示在上方左边对齐
top-end	显示在上方右边对齐

Events

事件名	说明	回调参数
change	展开/折叠状态变化时触发	state: boolean

Slots

插槽名	说明
button	触发按钮插槽
default	弹出内容插槽