Skip to content

Sticky 吸顶

Layout · Display component

Sticky content areas.

On-demand importwbbb-ui/components/sticky

Basic Usage

Example code
<script setup lang="ts">
import { WbbbSticky } from 'wbbb-ui/components/sticky'
import 'wbbb-ui/styles/sticky'
</script>

<template>
  <WbbbSticky />
</template>
Live mobile previewOpen in a new tab ↗

States and Interaction

All listed states can be operated and verified in the live Playground preview.

DefaultContent

API Reference

Props

PropertyDescriptionTypeDefaultRequired
offsetTopSets the distance from the top before sticky positioning starts.WbbbNumeric0No
zIndexSets the stacking order of the component.number700No

Events

None

Slots

  • default

Two-way binding

Does not support v-model.

Platform Notes

Build verification: H5, App Vue, WeChat Mini Program, Alipay Mini Program, and Douyin Mini Program.

Runtime differences: H5 supports keyboard focus and reduced motion. Mini Programs provide equivalent touch interaction; verify upload, date selection, and overlays on target platforms.

Usage note: Use Playground to verify further state combinations and cross-platform behavior.

Wbbb UI · Built for uni-app product experiences