小程序scroll-view组件不能触发相应滚动事件

在制作加载更多时会发现不能触发相应事件,一般情况下首先要查看两个必要的属性scroll-view的高度是否设置,第二就是scroll-view的滚动方向是否设置,缺一都有可能导致不能触发相应事件。
//wxml.  这里的高度可以用自适应高度
<scroll-view class='index-container' style="height:{{windowHeight}}" scroll-y bindscrolltolower="lower">
<view class='nav'>
<view class='nav-item' wx:for="{{navData}}" wx:for-index="id" wx:for-item="item" id="{{item.id}}" wx:key="id" bindtap="navClick">
<image class='contant_address_right' src="{{currentNavId==item.id?item.selectImage:item.image}}" class='nav-image' mode="aspectFit"></image>
<text class='{{currentNavId==item.id?"nav-item-text-actived":"nav-item-text"}}'>{{item.name}}</text>
</view>
</view>
<template is="{{currentTemplate}}" data="{{...goodsData}}"/>
<view class='loadmore' hidden="{{loadmore}}">
<text style='font-size: 28rpx;color: #2b2b2b;'>加载更多...</text>
</view>
</scroll-view>
   Page({
lower: function (e) {
if (this.data.loadmoreData){
this.setData({
loadmore: 'true',
})
this.loadmorenav();
}else{
this.setData({
loadmore: 'false',
})
}
},
onLoad: function (options) {
this.initfun();
var that = this;
wx.getSystemInfo({
success: function (res) {
that.setData({
windowHeight: res.windowHeight+"px",
})
}
})
}
})

小程序--->scroll-view组件不能触发相应滚动事件的更多相关文章

  1. 微信小程序 -- scroll view

    效果图:横向滚动和纵向滚动 scroll view使用方法文档,前面已经介绍查找文档方法,此处不再赘述 一.横向滚动 创建一个页面scroll-nav 然后,在.wxml文件中排版 <!--水平 ...

  2. 微信小程序中的组件使用1

    不管是vue还是react中,都在强调组件思想,同样,在微信小程序中也是使用组件思想来实现页面复用的,下面就简单介绍一下微信小程序中的组件思想. 组件定义与使用 要使用组件,首先需要有组件页面和使用组 ...

  3. 微信小程序之自定义组件的应用

    小程序支持自定义组件,下面是一个简单的购物车组件,实现的效果如图: 效果图 创建组件 在根目录创建components目录,然后创建计数组件 count 如图: 组件内容 <!--compone ...

  4. 微信小程序之swiper组件高度自适应

    微信小程序之swiper组件高度自适应 要求: (顶部广告栏 ) 改变swiper组件的固定高度,使之随内部每张图片的高度做自适应 原理: 图片加载完之后,获取图片的原始宽高,根据宽高比,计算出适应后 ...

  5. 小程序解决方案 Westore - 组件、纯组件、插件开发

    数据流转 先上一张图看清 Westore 怎么解决小程序数据难以管理和维护的问题: 非纯组件的话,可以直接省去 triggerEvent 的过程,直接修改 store.data 并且 update,形 ...

  6. 微信小程序自定义音频组件,自定义滚动条,单曲循环,循环播放

    小程序自定义音频组件,带滚动条 摘要:首先自定义音频组件,是因为产品有这样的需求,需要如下样式的 而微信小程序API给我们提供的就是这样的 而且产品需要小程序有后台播放功能,所以我们不考虑小程序的 a ...

  7. 微信小程序基于swiper组件的tab切换

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

  8. 「小程序JAVA实战」小程序的基础组件(24)

    转自:https://idig8.com/2018/08/12/xiaochengxu-chuji-24/ 来说下 ,小程序的基础组件.源码:https://github.com/limingios/ ...

  9. 微信小程序 | 51,live新课“小程序UI容器组件”的课堂计划

    零基础前端自学入门:小程序UI容器组件 这是一节以UI布局.容器组件的使用为主题的live,专注于布局与容器这一个点,努力把这一点讲透.这是继4月22日整体入门live“零基础周末学习小程序开发”之后 ...

随机推荐

  1. JMeter Webservice API测试计划

    Web Services Web服务被定义为旨在通过网络支持两台机器之间交互的软件系统.它被设计为具有以通常在Web服务描述语言(WSDL)中指定的机器可处理格式描述的接口. 通常,“HTTP”是最常 ...

  2. Python_全局变量的定义

    1.在my套件下新建一个关键字systemkey并进行脚本的编写:创建一个${var1}变量,并赋值为aaaaaaaaaa Set Global Variable        ${var1}    ...

  3. 空气质量管理系统ssm(mybatis+spring+springMVC)框架+前后端分离

    1.目录结构: 2.需要注意的地方 2.1在WEB-INFO下新建 2.1.1 springMVC-servlet.xml <?xml version="1.0" encod ...

  4. 【原创】(十四)Linux内存管理之page fault处理

    背景 Read the fucking source code! --By 鲁迅 A picture is worth a thousand words. --By 高尔基 说明: Kernel版本: ...

  5. 关于js如果控制标签的字符长度

    js名字长度限定(如限制为50个字符,超过的显示...) var new_playerName = ""; jQuery(".translate").each( ...

  6. 清晰架构(Clean Architecture)的Go微服务: 日志管理

    良好的日志记录可以提供丰富的日志数据,便于在调试时发现问题,从而大大提高编码效率. 记录器提供的自动化信息越多越好,日志信息也需要以简洁的方式呈现,便于找到重要的数据. 日志需求: 无需修改业务代码即 ...

  7. $[NOIp2008]$双栈排序 栈/二分图/贪心

    \(Sol\) 先考虑单栈排序,怎么样的序列可以单栈排序呢?设\(a_i\)表示位置\(i\)是哪个数.\(\exist i<j<k\),都没有\(a_k<a_i<a_j\), ...

  8. $CF311B\ Cats\ Transport$ 斜率优化

    AcWing Description Sol 设f[i][j]表示前i个饲养员接走前j只猫咪的最小等待时间. 要接到j猫咪,饲养员的最早出发时间是可求的,设为d: $ d[j]=Tj-\sum_{k= ...

  9. LibreOJ 6278. 数列分块入门 2 题解

    题目链接:https://loj.ac/problem/6278 题目描述 给出一个长为 \(n\) 的数列,以及 \(n\) 个操作,操作涉及区间加法,询问区间内小于某个值 \(x\) 的元素个数. ...

  10. EF 使用lambda表达式 更新一对多数据时报错

    1.需求  更新一对多表中的附表数据,表结构如下: 2.思路 个人觉得一个个去对比关联的附表数据是删除还是添加比较麻烦,就直接清空主表关联的附表,然后重新建立关联关系. 3.弊端 如果附表(前提是附表 ...