小程序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. Python 多组输入

    #基于Python2.7 #若是想Python做到和C++中while(scanf()!=EOF)一样的多组输入效果,可以如实例所示书写 #实例实现了多组输入,计算A+B+C并输出的任务 while ...

  2. 同时安装了python3.4和python3.5,如何使用pip?

    首先我们python3.4 -m pip --version一下 再python3.5 -m pip --version 一下 发现两个pip版本不同,在使用pip3时,使用的其实是python3.4 ...

  3. nginx部署VUE跨域访问api

    H5端配置跨域 nginx跨域配置 server { listen 80; charset utf-8; server_name you_dome_name;#location /tasklist.j ...

  4. 洛谷$P2168\ [NOI2015]$荷马史诗 贪心

    正解:贪心 解题报告: 传送门$QwQ$ 昂这个就哈夫曼树板子题鸭$QwQ$,只是从二叉变成多叉了$QwQ$ 考虑用类似合并果子的方法?就从两个变成$k$个了嘛,一样的鸭,然后就做完了$QwQ$ 注意 ...

  5. 1040 有几个PAT (25 分)C语言

    字符串 APPAPT 中包含了两个单词 PAT,其中第一个 PAT 是第 2 位§,第 4 位(A),第 6 位(T):第二个 PAT 是第 3 位§,第 4 位(A),第 6 位(T). 现给定字符 ...

  6. hadoop传递参数方法总结

    转自:http://blog.csdn.net/xichenguan/article/details/22162813 写MapReduce程序通常要传递各种各样的参数,选择合适的方式来传递参数既能提 ...

  7. (三)Django模板语言

    一.字典,列表,类在template模板中的使用 在视图函数中,即views.py中进行传值操作,可通过render方法,进行传值 from django.shortcuts import rende ...

  8. [技术翻译]Web网页内容是如何影响电池使用寿命的?

    本周再来翻译一些技术文章,本次预计翻译三篇文章如下: 04.[译]使用Nuxt生成静态网站(Generate Static Websites with Nuxt) 05.[译]Web网页内容是如何影响 ...

  9. nginx错误: [error] OpenEvent("Global\ngx_reload_10444") failed (2: The system cannot find the file specified)

    执行nginx -s reload命令: nginx: [error] OpenEvent("Global\ngx_reload_10444") failed (2: The sy ...

  10. 序列积第m小元素 二分答案优化

    给出两个长度为n的数组A和B, 在A和B中各任取一个, 可以得到n×n个积. 求第m小的元素. n<=100000 这一道题的意思就是 a1 a2 a3 a4.. b1 b2 b3 b4 n^2 ...