@xwink/ui

    HoverCard

    指针停在用户名、链接上时弹出摘要卡片,不用点进去就能看个大概。停留 openDelay(缺省 500ms)才开,扫过去不会弹;离开 closeDelay(缺省 200ms)才收,留出从触发元素挪进卡片的时间。

    用户名上的资料卡

    这条会员记录由 @xiangwenke 在 10 月 9 日开通。

    它只是捷径。 触屏没有悬停,键盘聚焦时会开但读屏不念卡片内容,所以卡片里不放唯一入口:触发元素本身要能点进完整页面,卡片里的信息在那个页面上也要有。要点开才看、里面有可操作内容的用 Popover,只是一句说明的用 Tooltip。

    默认插槽是触发元素(落在插槽里的元素上,不额外包一层),#content 是卡片内容;宽度缺省 18rem,用 class 改。

    API

    Props

    名称类型默认值说明
    side"top" | "bottom" | "left" | "right" | undefined"bottom"—
    align"end" | "start" | "center" | undefined"center"—
    sideOffsetnumber | undefined8与触发元素的间距(px),缺省 8
    openDelaynumber | undefined500指针停留多久才开(ms),缺省 500:扫过去不该弹
    closeDelaynumber | undefined200离开多久才收(ms),缺省 200:留出从触发元素挪进卡片的时间
    openboolean | undefinedfalse—

    Emits

    事件载荷说明
    update:open[value: boolean]—

    Slots

    插槽说明
    default—
    content—