Scroll-View

相信大家在使用scroll-view的时候遇到不少问题,网上也有些答案,但是类似我这个问题,貌似没搜索到答案~~

今天媳妇问我,为什么bindscrolltolower突然不生效了~~~  我从原来的项目看了下,的确是没有问题的.... 但是他的代码有的页面可以有的页面不可以.

最后发现 的确太坑,这里记录一下.

当在scrollview里面渲染template 的时候~ 大家习惯外层都会嵌套一层view ~~~~问题就在这里了.

有些人为了方便,是在template里面有个view 写完整了style,   包裹template的view就没写和高度有关的style~~~~~ 问题就在这里.

大致代码如下

<scroll-view scroll-y class="showPanelBox" bindscrolltolower="lower" scroll-top='' lower-threshold=''>
<block wx:for="{{showlist}}" wx:for-item="item" wx:key="">
<view style='margin-top:1px'> <--------划重点
<template is="collected" data="{{...item}}"></template>
</view>
</block>
</scroll-view>

哪怕你是用margin-top:1px 都可以, 但是这个外层view 必须有和宽高相关的style,如果没有~~那么就对不起.....lower不动....

大致猜想是渲染前后计算高度导致scrollview认为里面没内容,虽然你拖动了,但是根本不是在这个组件里面拖动的~~~~都是猜的, 思路有点乱. 就不多BB了.

感觉也是写代码规范的问题~

小程序之ScrollView细节坑的更多相关文章

  1. 微信小程序之scroll-view的坑

    好久没动小程序了,今天打算复习复习,结果刚写了一个scroll-view就遇到了一个坑,这怎么能忍,对比看文档也没发现那里出了问题,没办法只能去翻翻微信给的demo,发现scroll-view一个必要 ...

  2. 微信小程序中scroll-view的几个坑

    微信小程序中scroll-view的几个坑 1:设置scroll-x时,却不能横向滚动,因为view是block组件,但是这里用了flex就不能滚动了(想用flex布局,请开启属性enable-fle ...

  3. 小程序组件 scroll-view 滑动

    小程序组件 scroll-view 中分别有上下竖向滑动和左右横向滑动之分,在这次项目中刚好需要用到横向滑动,但在测试过程中发现横向滑动没有了效果(静止在那里没移动过),经调试发现: 1.scroll ...

  4. 微信小程序基于scroll-view实现锚点定位

    代码地址如下:http://www.demodashi.com/demo/14009.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

  5. 小程序组件 scroll-view 横向滚动条无效

    小程序组件 scroll-view 中分别有上下竖向滑动和左右横向滑动,在这次项目中刚好需要用到横向滑动,但在测试过程中发现横向滑动没有了效果(静止在那里没移动过,并且换行了),经调试发现: 1.sc ...

  6. 小程序onLaunch事件的坑

    记一个小程序踩过的坑 小程序项目中app.js里面定义了globalData,即全局变量,里面定义了一个token字段 需求是这样的,每次进入小程序的时候需要检验该token有没有,没有就请求后台获取 ...

  7. 微信小程序开发常见之坑

    https://www.cnblogs.com/shunxing/articles/6971648.html input里的value会在浮层上面的,要解决这一问题还是很简单的,在小程序中input有 ...

  8. 小程序textarea完美填坑

    相信做微信小程序的码友们都被textarea这个原生组件坑过,什么placeholder位置错乱,穿透弹窗或遮罩层,ios上输入法弹起后换行输入内容遮挡,删除输入内容时内容被遮挡等等... 反正综上所 ...

  9. 小程序:scroll-view组件滑动多次触发scroll事件的bug解决

    在项目开发过程中,组件是微信小程序提供给我们的一个分页器,一般滑动到底部时会触发scroll事件,scroll事件中往往包含对后端数据的请求:若是还未滑动到底部时频繁触发事件,则会频繁发请求,达不到想 ...

随机推荐

  1. Python&amp;MySQL&amp;PyQt

    环境: Python2.7+MySQL5.6+PyQt4 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/40 ...

  2. Jena将owl文件持久化到数据库中

    package cn.edu.shu.db; import java.io.File; import java.io.FileInputStream; import java.io.IOExcepti ...

  3. kotlin web开发教程【一】从零搭建kotlin与spring boot开发环境

    IDEA中文输入法的智能提示框不会跟随光标的问题 我用的开发工具是IDEA 这个版本的IDEA有一个问题: 就是中文输入法的智能提示框不会跟随光标 解决这个问题的办法很简单,只有在安装目录下把JRE文 ...

  4. Asp.net MVC 填充word并下载

    使用Aspose.word填充内容并下载(免费版Aspose) 填充固定模式的Word文档,需要先制作Word模板: Aspose.Words主要通过Words里域(Fields)来控制内容.     ...

  5. Centos 7 安装 PostgreSQL

    本文只讲PostgreSQL在CentOS 7.x 下的安装,其他系统请查看:https://www.postgresql.org/download PostgreSQL 所用版本为:PostgreS ...

  6. Effective Java 第三版——6. 避免创建不必要的对象

    Tips <Effective Java, Third Edition>一书英文版已经出版,这本书的第二版想必很多人都读过,号称Java四大名著之一,不过第二版2009年出版,到现在已经将 ...

  7. 利用反射操作bean的属性和方法

    今天在开发中碰到这样一个场景:当请求添加项目下的目录时,传过来的是一个IndexModel,这个Model里有关于这个目录字段的详细信息,包括基础报表,实时,漏斗等信息(这些字段类型都是boolean ...

  8. gulp实现公共html代码复用

    在开发网站的时候,尤其是类似于官网这样的项目,顶部都会有一个导航栏,底部会有一些其他信息,而这两个部分在每一个页面都是有的.我们不可能在每个html页面都写一遍,这样也不便后期维护等操作,所以可以把顶 ...

  9. Git使用简单总结

    创建版本库git add加入到暂存区git commit -m" "加入到分支 时光机穿梭git satus查看仓库的当前状态git diff file 查看修改内容 版本回退HE ...

  10. Laravel学习笔记(二)

    解决了类自动加载的问题,剩下的问题就是看文档了,laravel的官方文档虽然简单,但是却包含了很多基础知识,学习Laravel最好先看看官方文档,我感觉帮助很大,因为laravel框架的源码看起来并不 ...