试试直接给这个导航栏设置这个样式属性呗 position: -webkit-sticky; position: sticky; top: 0;
用scroll-view 组件监听滚动某个位置setData赋值很慢用scroll-view向上或向下监听滚动到某一个位置,然后用this.setData让scrollTop变成true或false,使某一块fixed定位到页面顶部,我直接在页面上显示scrollTop的值,很慢才显示出来。这样导致fixed布局的那个块也定位很慢,用户体验非常差。PS:我尝试用showToast输出,速度非常快,证明方法是没问题的,有问题的是setData赋值很慢。
2018-07-04hello?沉了吗
scroll-view内顶部溢出内容下拉时无法显示- 需求描述 购物车页面,顶部是地址选择栏(80rpx),中间是购物车商品列表,底部是结算栏(110rpx)。禁用页面的滚动,让顶部栏、底部栏固定在页面顶部和底部,列表用scroll-view放在页面中间提供滚动效果。 ====== 现在需要给购物车列表添加下拉刷新功能,需要加入一个下拉后可以看见的加载提示view,但是放在scroll-view中超出页面顶部范围的后其内容全部不渲染,设置overflow也没有效果,以下是我的做法: wxml: [代码]<[代码][代码]scroll-view[代码] [代码]class[代码][代码]=[代码][代码]"cart-list"[代码] [代码]scroll-y[代码][代码]=[代码][代码]"{{true}}"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"inner-view"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"header"[代码][代码]>[代码][代码] [代码][代码]</[代码][代码]view[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"list-item"[代码] [代码]wx:for[代码][代码]=[代码][代码]"{{cartList}}"[代码] [代码]wx:key[代码][代码]=[代码][代码]"{{id}}"[代码][代码]>中间购物车内容省略...</[代码][代码]view[代码][代码]>[代码][代码] [代码][代码]</[代码][代码]view[代码][代码]>[代码][代码]</[代码][代码]scroll-view[代码][代码]> [代码]wxss: [代码].cart-list {[代码][代码] [代码][代码]position[代码][代码]: [代码][代码]absolute[代码][代码];[代码][代码] [代码][代码]width[代码][代码]: [代码][代码]100%[代码][代码];[代码][代码] [代码][代码]top[代码][代码]: [代码][代码]80[代码][代码]rpx;[代码][代码] [代码][代码]bottom[代码][代码]: [代码][代码]110[代码][代码]rpx;[代码][代码] [代码][代码]overflow[代码][代码]: [代码][代码]visible[代码][代码];[代码][代码]}[代码] [代码]scroll-view .inner-view {[代码][代码] [代码][代码]position[代码][代码]: [代码][代码]relative[代码][代码];[代码][代码] [代码][代码]width[代码][代码]: [代码][代码]100%[代码][代码];[代码][代码] [代码][代码]overflow[代码][代码]: [代码][代码]visible[代码][代码];[代码][代码]}[代码] [代码]scroll-view .inner-view .header {[代码][代码] [代码][代码]width[代码][代码]: [代码][代码]100%[代码][代码];[代码][代码] [代码][代码]height[代码][代码]: [代码][代码]100[代码][代码]rpx;[代码][代码] [代码][代码]background-color[代码][代码]: [代码][代码]red[代码][代码];[代码][代码] [代码][代码]position[代码][代码]: [代码][代码]absolute[代码][代码];[代码][代码] [代码][代码]top[代码][代码]: [代码][代码]-100[代码][代码]rpx;[代码][代码] [代码][代码]z-index[代码][代码]: [代码][代码]50[代码][代码];[代码][代码]}[代码] [代码].[代码][代码]list-item[代码] [代码]{[代码][代码] [代码][代码]position[代码][代码]: [代码][代码]relative[代码][代码];[代码][代码] [代码][代码]width[代码][代码]: [代码][代码]100%[代码][代码];[代码][代码] [代码][代码]height[代码][代码]: [代码][代码]260[代码][代码]rpx;[代码][代码] [代码][代码]border-bottom[代码][代码]: [代码][代码]1px[代码] [代码]solid[代码] [代码]#dcdcdc[代码][代码];[代码][代码]}[代码]列表下拉时无法看见.header 另外,如果将.header中top改成-50rpx,则可以看见一半高度的红色,下拉仍然无法看见超出的部分,如下图 效果截图: (1)top为-100rpx时 [图片] (2)top为-50rpx时 [图片] - 希望提供的能力 scroll-view内部的超出内容可用overflow控制显示
2018-05-14