{site_name}

{site_name}

🌜 搜索

Vant3 Sticky 粘性布局是指在页面滚动时,元素能够固定在指定位置的布局方式

前端 𝄐 0
vant panel,vant的table,vant tab,vant的tab组件用法,vant tabber,vant滑动
Vant3 Sticky 粘性布局是指在页面滚动时,元素能够固定在指定位置的布局方式。它通常用于实现页面内的导航栏、工具栏等组件,在页面滚动过程中保持不变。

Vant3 是一个基于 Vue.js 的移动端组件库,它提供了一个名为 Sticky 的组件来实现粘性布局。通过设置 Sticky 组件的属性,可以控制其在页面上的定位方式以及固定的位置。例如:

html
<van-sticky>
<van-nav-bar title="标题" left-text="返回"></van-nav-bar>
</van-sticky>


上述代码中,使用了 Vant3 的 NavBar 组件作为 Sticky 的子组件。由于 Sticky 的存在,当页面滚动时,NavBar 组件会一直停留在屏幕顶部,并且在超出指定区域后自动隐藏。

除了 NavBar 组件外,还可以将其他组件作为 Sticky 的子组件,从而实现各种不同的粘性布局效果。