【微信小程序】解决 竖向<scroll-view>组件 “竖向滚动页面出现遮挡”问题
问题图:

问题原因:
<scroll-view class="scroll-container" upper-threshold="{{sortPanelDist}}" scroll-y="true" style="height:{{scrollHeight}}px;" bindscrolltolower="bindDownLoad" bindscroll="scroll" bindscrolltoupper="refresh">
其中,style="height:{{scrollHeight}}px;" 属性设置不够,导致出现遮挡。
剖析:首页没有出现这样,在其他tarbar页才出现。
解决:
onLoad: function (options) {
var that = this;
//获取系统的参数,scrollHeight数值,微信必须要设置style:height才能监听滚动事件
wx.getSystemInfo({
success: function (res) {
that.setData({
scrollHeight: parseInt(res.windowHeight)+200
})
}
});
},
//给获取的系统高度,再加上200px
完美解决。
【微信小程序】解决 竖向<scroll-view>组件 “竖向滚动页面出现遮挡”问题的更多相关文章
- 小程序-文章:微信小程序常见的UI框架/组件库总结
ylbtech-小程序-文章:微信小程序常见的UI框架/组件库总结 1.返回顶部 1. 想要开发出一套高质量的小程序,运用框架,组件库是省时省力省心必不可少一部分,随着小程序日渐火爆,各种不同类型的小 ...
- 微信小程序入门与实战 常用组件API开发技巧项目实战*全
第1章 什么是微信小程序? 第2章 小程序环境搭建与开发工具介绍 第3章 从一个简单的“欢迎“页面开始小程序之旅 第4章 第二个页面:新闻阅读列表 第5章 小程序的模板化与模块化 第6章 构建新闻详情 ...
- 使用wepy开发微信小程序商城第二篇:路由配置和页面结构
使用wepy开发微信小程序商城 第二篇:路由配置和页面结构 前言: 最近公司在做一个微信小程序的项目,用的是类似于vue的wepy框架.我也借此机会学习和实践一下. 小程序官方文档:https://d ...
- 微信小程序 在canvas画布上划动,页面禁止滑动
要实现微信小程序 在canvas画布上划动,页面禁止滑动,不仅要设置disable-scroll="true",还要要给canvas绑定一个触摸事件才能生效. <canvas ...
- 微信小程序开发03-这是一个组件
编写组件 基本结构 接上文:微信小程序开发02-小程序基本介绍 我们今天先来实现这个弹出层: 之前这个组件是一个容器类组件,弹出层可设置载入的html结构,然后再设置各种事件即可,这种组件有一个特点: ...
- 微信小程序开发之picker选择器组件用法
picker组件时一个从底部弹起的可滚动的选择器(嵌入页面滚动器组件picker-view查看https://mp.weixin.qq.com/debug/wxadoc/dev/component/p ...
- 微信小程序开发---视图层(View)
WXML WXML能力: 数据绑定 列表渲染 条件渲染 模板 事件 数据绑定 数据绑定使用 Mustache 语法(双大括号)将变量包起来,可作用于内容,组件属性(需要在双引号之内),控制属性(需要在 ...
- 微信小程序template模板与component组件的区别和使用
前言: 除了component,微信小程序中还有另一种组件化你的方式template模板,这两者之间的区别是,template主要是展示,方法则需要在调用的页面中定义.而component组件则有自己 ...
- 微信小程序入坑之自定义组件
前言 最近接触微信小程序,再次之前公司用的前端框架是vue ,然后对比发现,开发小程序是各种限制,对于开发者非常不友好.各种槽点太多,完全吐槽不过来,所以在此不多说,打算下次专门写一篇文章吐槽一下.本 ...
- 微信小程序常见的UI框架/组件库总结
想要开发出一套高质量的小程序,运用框架,组件库是省时省力省心必不可少一部分,随着小程序日渐火爆,各种不同类型的小程序也渐渐更新,其中不乏一些优秀好用的框架/组件库. 1:WeUI 小程序–使用教程 h ...
随机推荐
- 算法:基于 RingBuffer 的 Queue 实现《续》
背景 上篇实现了一个简单的队列,内部使用了 _count 计数,本文采用另外一种模式,不用 _count 计数. RingBuffer 不用 _count 计数的话,为了区分队列的满和空,需要在数组中 ...
- dwz navtab 限制打开数量实例
本文章给大家介绍一个dwz navtab 限制打开数量实例,希望此教程对各位同学会有所帮助 openTab: function(tabid, url, options){ //if found tab ...
- jaxb使用
一.前言 JAXB——Java Architecture for XML Binding,是一项可以根据XML Schema产生Java类的技术.JAXB提供将XML实例文档反向生成Java对象树的方 ...
- C#中的托管与非托管
在.net 编程环境中,系统的资源分为托管资源和非托管资源. 字面理解托管,就是托付个别人管理,要的是结果,具体怎么完成的我并不关心,就像某些'牛逼'的老板“我只要结果”那样. 在.NET FRAME ...
- 怎样让你的APK跑在 com.android.phone 进程
首先:为什么要跑在 com.android.phone 进程 这还用问,在同一个进程里就能够干非常多事情了这是黑客行为 为什么能跑在统一进程? Google 在设计 Dalivk 虚拟机的时候就考虑到 ...
- FizzBuzzWhizz问题python解法
FizzBuzzWhizz 你是一名体育老师,在某次课距离下课还有五分钟时,你决定搞一个游戏.此时有100名学生在上课.游戏的规则是: 1. 你首先说出三个不同的特殊数,要求必须是个位数,比方3.5. ...
- python文章学习列表
1.https://home.cnblogs.com/u/darkpig/feed/blog/ 这篇博主的系列文章 2.
- SQL-查询排名
select row_number() over(order by amount) as rank,* from dbo.t_group
- Ionic 4 and the Lifecycle Hooks
原文: https://medium.com/@paulstelzer/ionic-4-and-the-lifecycle-hooks-4fe9eabb2864 ------------------- ...
- Sqlserver存储过程生成日期维度
话不多说,之前已经有一篇日志是利用oracle的存储过程生成日期维度表,接下来我们就用sqlserver来实现这个操作,如下面的步骤所示 1:创建日期维度表(Dim_time) USE [DW] GO ...