提交 0830e83f 编写于 作者: 辛宝Otto's avatar 辛宝Otto 🥊

Merge branch 'xyytcs/unidocs-zh-xyytcs-master-patch-26138' into docs/merge-docs

......@@ -64,3 +64,38 @@ app端nvue专用组件。
**注意**
- waterfall是区域滚动,不会触发页面滚动,无法触发pages.json配置的下拉刷新、页面触底onReachBottomDistance、titleNView的transparent透明渐变。
- 如出现waterfall列表下边大面积空白区域(多列和单列时的整体高度相同,多列展示没有高度自适应),那么可以将waterfall放到父容器下边,给父容器高度设置为窗口高度,除瀑布流展示的列表外,其他的组件都放在<header>中即可。
示例代码如下:
```html
<template>
<waterfall column-count="2" column-width="auto" :style="{ height: windowHeight + 'px' }">
<header>
<!--轮播-->
<swiper class="swiper_banner">
......
</swiper>
<!--广告位-->
<view class="ads_List_box">
......
</view>
</header>
<!--瀑布流展示的商品列表-->
<cell v-for="num in lists" >
<text>{{num}}</text>
</cell>
</waterfall>
</template>
<script>
export default {
data () {
return {
lists: ['A', 'B', 'C', 'D', 'E'],
windowHeight: uni.getSystemInfoSync().windowHeight
}
}
}
</script>
<style></style>
```
<img src="https://ask.dcloud.net.cn/uploads/answer/20231103/7eca97560500b11a95f2014fdaea1281.png" />
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册