关于微信小程序bug记录与解决方法

微信小程序bug记录

textarea

1.textarea在模拟器上没有padding,可是在真机上会自带padding,而且在外部改不了,并且在安卓和IOS上padding还不一样


第一张图是在开发工具上的,第二张图是在IOS真机上的。从上图可以看出来,在开发工具上显示很正常,而且没有padding,可是在真机上左上角就出现了padding,并且无论你在外部对textarea的padding做任何处理,都无法覆盖。
目前有一种解决方式是根据ios和android的不同平台来给teaxarea设置不同的样式。
解决方法:通过wx.getSystemInfo来获取当前设备的平台(IOS or Android),然后根据不同的平台来设置不同的偏移样式来兼容(可以通过margin:负值)。

2,textarea层级最高,而且还没办法使用z-index来修改,使得自制modal等组件出现问题。这个问题同样在开发工具上没问题,在真机上才出现问题。

目前的解决方法:在modal弹起的时候,将textarea隐藏掉,具体隐藏方法看3

3.textarea使用display:none;visibility: hidden; opacity: 0都隐藏不了。

目前的解决方法:

textarea.hidden {
  position: relative;
  left: -1000%;
}

总结

以上所述是小编给大家介绍的关于微信小程序bug记录与解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

(0)

相关推荐

  • 微信小程序出现wx.getLocation再次授权问题的解决方法分析

    本文实例讲述了微信小程序出现wx.getLocation再次授权问题的解决方法.分享给大家供大家参考,具体如下: 首先,在page外定义一个公共函数用于发送获取位置的请求 var getLocation = function (that) { wx.getLocation({ type: 'wgs84', success: function (res) { // 经纬度 var latitude = res.latitude var longitude = res.longitude var a

  • 详解微信小程序审核不通过的解决方法

    前言 近来,微信小程序一直活跃在开发者的眼球中.很多开发者都投身微信小程序的开发中,而这些开发者,总是需要面对最后一道难题:如何以一种优雅的姿势来通过微信官方的审核.本文基于几天前提交审核的一次总结,写得有不当的地方,请各位大佬指正. 问题描述 先上一下微信小程序平台常见拒绝情形的说明文件.由于我提交的小程序中包含了"分享群"的按钮,所以审核未通过,未通过的原因如下: 3.2.1 小程序的页面内容中,存在诱导类行为,包括但不限于诱导分享.诱导添加.诱导关注公众号.诱导下载等,要求用户分

  • 微信小程序录音文件格式silk遇到的问题及解决方法

    不好意思,误导大家了,这种将silk解密的方式只是在小程序测试的时候可以,上线以后这种方法是不行的,还是需要使用解密转码.参见:https://github.com/kn007/silk-v3-decoder 微信小程序的录音文件就是个坑... 录音文件为silk格式,说是silk其实是base64加密后的webm格式,只需将其转为webm格式即可. 我在解决问题的过程中,学到了,遇到问题一定要抓住本质,本来我以为silk是啥格式,这不懵逼了,赶紧找audio是否能播放silk,不能播放就去找网

  • 微信小程序 图片边框解决方法

    微信小程序 图片边框问题解决 在最开始对网页进行构建的时候,我们并不知道网站中需要放置那些特定的图片,所以我们往往会放置一个空的img标签,但是这样的话,图片标签因为没有src的值,所以在网站中会显示出来一个黑色的边框, 其代码及效果显示如下: 在这里就解决黑色边框,提出两种解决方案: 1.设置图片的opacity:0; 2.放置一个其他的块标签代替img标签,因为在这里img只是起到占位的功能,所以可以使用其他的标签替代,在使用的时候,在换回img标签. 感谢阅读,希望能帮助到大家,谢谢大家对

  • 微信小程序scroll-x失效的完美解决方法

    失效的scroll-x 在微信小程序的文档中,使用scroll-view标签,然后给它设置一个scroll-x就可以实现元素,横向排列,可以左右滑动.... 然而,在实际开发中,发现并不是这么简单...贴上部分wxml和wxss代码- <!-- 横向滚动商品 --> <scroll-view class='scroll-box' scroll-x > <view class='box'> <view class='box-hd'> <image src

  • 微信小程序出现wx.navigateTo页面不跳转问题的解决方法

    本文实例讲述了微信小程序出现wx.navigateTo页面不跳转问题的解决方法.分享给大家供大家参考,具体如下: 今天在做微信小程序的时候,做的商品购买流程.流程是这样的: 商品展示-->商品详情-->下单页面-->下单详情页面-->支付结果页面-->跳转订单详情页面. 但是在支付成功之后,点击按钮跳转,发现怎么也跳转不了到订单详情页面,前后log都能打印出来,证明已经执行了wx.navigateTo方法,但是跳转不成功,而且,坑爹的是也不报错. 翻看微信小程序开发文档,参考

  • 微信小程序 加载 app-service.js 错误解决方法

    微信小程序开发过程中出现错误,经过一番思考解决此问题,这里给大家提醒下! 加载 app-service.js 错误 WAService.js:2 不要在 undefined.js 注册多个Page APP-SERVICE-Engine:Please do not register multiple Page in undefined.js 开始新建一个小程序,结果报这么多错误. 但是我点击到编辑页查看的时候,没有pages,utils呀.. 进入app.js没有注册多个page呀. 感觉很奇怪,

  • 微信小程序首页数据初始化失败的解决方法

    一. 问题描述 用户首次后再次进入小程序时,我们通常需要通过获取用户openid或unionid用作唯一标示与后台进行数据交流,初始化用户信息.当我们通过第三方服务器跟微信建立请求时,微信需要用户确认是否公开信息.如图1,从console可以看到,在请求的同时,我们的首页index已经加载完成,图中初始化数据显示为空.无论我们将请求信息写在app.js的onload中或者index.js中,当我们点击确认后,请求信息才执行success方法,将第三方服务器返回的数据处理,这样的因需要用户点击而产

  • 微信小程序控制台提示warning:Now you can provide attr "wx:key" for a "wx:for" to improve performance解决方法

    本文实例讲述了微信小程序控制台提示warning:Now you can provide attr "wx:key" for a "wx:for" to improve performance解决方法.分享给大家供大家参考,具体如下: 在小程序控制台开发中遇到提示: warning: Now you can provide attr "wx:key" for a "wx:for" to improve performance.

  • 关于微信小程序bug记录与解决方法

    微信小程序bug记录 textarea 1.textarea在模拟器上没有padding,可是在真机上会自带padding,而且在外部改不了,并且在安卓和IOS上padding还不一样 第一张图是在开发工具上的,第二张图是在IOS真机上的.从上图可以看出来,在开发工具上显示很正常,而且没有padding,可是在真机上左上角就出现了padding,并且无论你在外部对textarea的padding做任何处理,都无法覆盖. 目前有一种解决方式是根据ios和android的不同平台来给teaxarea

  • uniapp微信小程序:key失效的解决方法

    uniapp 代码 <template> <view> <image v-for="(item, i) in fileList" :key="item[urlKey]" :src="item[urlKey]"></image> </view> </template> <script> export default { props: { urlKey: {defau

  • 微信小程序tabbar不显示解决办法

    微信小程序tabbar不显示解决办法 "pages":[ "pages/logs/logs", "pages/index/index" ], 微信小程序在测试tabbar的时候怎么都不显示. 我就不贴api了.直接上代码 { "pages":[ "pages/logs/logs", "pages/index/index" ], "window":{ "bac

  • 微信小程序 空白页重定向解决办法

    微信小程序 空白页重定向解决办法 在刚开始的时候将小程序的入口文件直接指向tabbar 的首页,此时出现问题:二维码扫描,第一次不关闭首页,第二次进入时:不会经过onLoad过程解析scene参数: 官方中解释:tabbar跳转方式触发的生命周期是 onShow,不经过onLoad,下图: 此时,和小伙伴讨论重定向问题时,想到用类似的方法可以做到,就立马实行: app.json中加pages/index/index(入口文件),pages/home/home(tabbar页面主页),pages/

  • 微信小程序利用for循环解决内容变更问题

    问题描述 学习小程序的小伙伴可能会有这样的问题:微信小程序的页面内容要发生改变,在小程序中如何快速的来创造一个格式相同,但仅仅改变内容且易于改变的页面呢?接下来就来解决这个问题吧. 解决方案 整体思路是创建一个数组,将页面内容写进数组,利用for循环来达到遍历数组的目的,从而实现利用数组的变量来改变页面的内容. 第一步:首先在 js页面在 data 中创建一个数组名为 sums ,并在数组当中添加内容. 代码示例: data: { sums:[{ imgone:"/pages/img/ 一人之下

  • 微信小程序 按钮滑动的实现方法

    微信小程序 按钮滑动的实现方法 一.先看东西 滑动前 滑动后 二.再上代码 index.wxml <view class="content"> <view class="sliderContent"> <input placeholder="验证码" placeholder-class="input-placeholder" disabled="{{disabled}}" /&

  • 微信小程序三级联动选择器使用方法

    本文实例为大家分享了微信小程序三级联动选择器的具体代码,供大家参考,具体内容如下 效果图 实现原理 利用微信小程序的picker组件,其中: 1,普通选择器:mode = selector实现一级选择实例: 2,省市区选择器:mode = region实现省市区三级联动: 3, 多列选择器:mode = multiSelector实现二级和三级联动的10以内数字的乘法. WXML <view class="tui-picker-content"> <view clas

  • 微信小程序如何实现数据共享与方法共享详解

    目录 全局数据共享 Mobox npm安装及其注意事项 小程序对 npm 的支持与限制 npm 依赖包的安装与使用 Mobox 组件方法共享 behaviors 1. 什么是 behaviors 2. behaviors 的工作方式 3. 创建 behavior 4. 导入并使用 behavior 5. behavior 中所有可用的节点 6. 同名字段的覆盖和组合规则 总结 全局数据共享 Mobox 原生小程序开发中我们可以通过 mobx-miniprogram 配合 mobx-minipro

  • 微信小程序之选项卡的实现方法

     微信小程序之选项卡的实现方法 前言: 从事前端的同学们一定不会对选项卡陌生,不管是自己原生写的,还是各个UI框架里带的,我想大家都使用过很多选项卡,对选项卡的原理也足够清楚了,下面我们来在微信小程序里实现选项卡的功能. 微信小程序里没有自带选项卡组件,但是却带有swiper组件,所以,我们便利用swiper来实现选项卡的功能. 先看效果图: 实现代码: 页面代码: <view class="swiper-tab"> <view class="swiper-

  • 微信小程序中setInterval的使用方法

    微信小程序中setInterval的使用方法 看了下小程序的画布功能,简单的使用了一下,用蹩脚的逻辑做了个 "弹啊弹,弹走鱼尾纹的小球",一起来看下吧.过程不重要主要是画布的使用哦.(本来想传gif的来着,后来发现不会传,就传个图片吧,想看的自己下载下来玩呦) 先上图,后上代码了: js: var winWidth = 0 var winHeight = 0 var diameter = 10 var time = 0 Page({ data:{ numX:1, numY:1 }, x

随机推荐