<template>
<waterfall class="view" :loadmoreoffset="200" column-count="2" column-gap="10" left-gap="10" right-gap="10">
<cell v-for="(item, key) in list" :key="key"><image class="thumb" :src="item" :style="style.thumb"></image></cell>
</waterfall>
</template>
<style scoped>
.view {
flex: 1;
}
.thumb {
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
</style>
<script>
let columnWidth=(uni.getSystemInfoSync().windowWidth - 30) / 2
export default {
data() {
return {
style: {
thumb: {
width: columnWidth,
height: columnWidth
}
},
list: [
'https://gw.alicdn.com/bao/uploaded/i1/2200652294577/O1CN01Dwpkfg1jgJMoeDrmz_!!0-item_pic.jpg',
'https://img.alicdn.com/imgextra/i3/2200737698598/O1CN01D0UaqV2DNw0g42LWu_!!2200737698598.jpg',
'https://img.alicdn.com/imgextra/i3/1107850921/O1CN01lcYEnO1IfrNtISfEu_!!1107850921.jpg',
'https://img.alicdn.com/imgextra/i2/2912050237/O1CN01koaWlM1DcaTMXPmwB_!!2912050237.jpg',
'https://img.alicdn.com/imgextra/i3/2454642791/O1CN012BHNX51WUK03JfiIy_!!2454642791.png',
'https://img.alicdn.com/imgextra/i1/2206682919202/O1CN01ASKc2E2HqZBnrwZbg_!!2206682919202.jpg',
'https://gw.alicdn.com/bao/uploaded/i1/2271925489/O1CN01W2yKyB1qQ0WZTMF4A_!!0-item_pic.jpg',
'https://gw.alicdn.com/bao/uploaded/i1/2208025730556/O1CN01hyDUCx1FygoodHMNd_!!0-item_pic.jpg',
'https://img.alicdn.com/imgextra/i1/2200737698598/O1CN01giF1T92DNvyDVqLtD_!!2200737698598-0-lubanu-s.jpg',
'https://gw.alicdn.com/bao/uploaded/i4/2492836366/O1CN01XZuBLm1wtfvvzuotR_!!0-item_pic.jpg',
'https://gw.alicdn.com/bao/uploaded/i1/431960778/O1CN019yTpQ91HcMlXduRlY_!!0-item_pic.jpg',
'https://img.alicdn.com/imgextra/i1/134348404/O1CN01rJX56f2Bx56Xg4CFL_!!134348404.jpg',
'https://gw.alicdn.com/bao/uploaded/i1/1091917423/O1CN01tD4ngj24hmc7V7H2u_!!0-item_pic.jpg',
'https://gw.alicdn.com/bao/uploaded/i1/2073542443/O1CN01wLGTyS1TuwBI0jxBL_!!0-item_pic.jpg',
'https://gw.alicdn.com/bao/uploaded/i1/1821286654/O1CN01s50HQP1z1a4oxZgsm_!!0-item_pic.jpg',
'https://gw.alicdn.com/bao/uploaded/i1/3531840159/O1CN01tbUSem1D2rc8hUwH7_!!0-item_pic.jpg',
'https://img.alicdn.com/imgextra/i3/2200737698598/O1CN01TObIPl2DNw1Ctykzi_!!2200737698598.jpg',
'https://img.alicdn.com/imgextra/i1/2208025730556/O1CN01dUD1Fp1FygqVWZNxQ_!!2208025730556.jpg',
'https://img.alicdn.com/imgextra/i1/2177709796/O1CN01YHic372MEcQYZC1HG_!!2177709796.jpg',
'https://gw.alicdn.com/bao/uploaded/i1/785996628/O1CN01cOa2Xw1ypfibkeA7p_!!785996628.jpg'
]
}
}
}
</script> 
汉中李
- 发布：2021-02-19 03:57
- 更新：2021-02-19 20:34
- 阅读：703
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： 10
HBuilderX类型： 正式
HBuilderX版本号： 3.1.2
手机系统： Android
手机系统版本号： Android 6.0
手机厂商： 模拟器
手机机型： mumu模拟器
页面类型： nvue
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
原工程要测试比较复杂，代码示例比较纯净元素没那么多内存增长较慢，所以需要连续不间断上下滑动列表20~30次，就会出现内存攀升并不会得到释放
原工程要测试比较复杂，代码示例比较纯净元素没那么多内存增长较慢，所以需要连续不间断上下滑动列表20~30次，就会出现内存攀升并不会得到释放
预期结果：
正常
正常
实际结果：
内存泄漏
内存泄漏
bug描述：
今天很神奇电脑居然内存耗尽系统崩溃，先以为是模拟器问题，排查到最后居然是image组件的2个css属性导致的。
waterfall列表cell下面都有图片，image添加圆角属性，然后不断滑动列表内存暴涨，直到系统内存耗尽。取消2个属性恢复正常。
汉中李 (作者)
以更新示例代码 清注意“复现步骤”
2021-02-19 19:09
DCloud_Android_ST
回复 汉中李: 收到 我们测试下
2021-02-19 19:23
DCloud_Android_ST
回复 DCloud_Android_ST: 是反复上下滚动吗 我这边查看并没有发现内存会跟随滚动次数增加而增加呀
2021-02-19 19:30
汉中李 (作者)
回复 DCloud_Android_ST: 是的复返滚动，我这边就出现了，同样的代码，工程也是新建的
2021-02-19 19:37
汉中李 (作者)
回复 DCloud_Android_ST: 你看我截图，刚开始内存才100多M，反复滚动后就1400多了
2021-02-19 19:41
DCloud_Android_ST
回复 汉中李: 我是把你的代码设置为首页你可以试下。真机设备试下。
2021-02-19 19:41
汉中李 (作者)
回复 DCloud_Android_ST: 真机测试我看不到内存.....，要不你试下MUMU模拟器
2021-02-19 19:45