关闭

微信小程序遇到的坑

时间: 2018-12-02阅读: 2918标签: 小程序

小程序textarea组件字数限制问题  

解决方法:

<textarea name="content" maxlength='-1'></textarea>


scroll-view 中不能使用 textarea 组件 

swiper和swiper-item是继承scroll-view的,所以在他们里面使用textarea的时候会出现很奇怪的现象,比如placeholder错位。解决方法:

用view组件替换swiper组件,用微信小程序的wx.animation()实现点击切换效果 除此之外, 在 scroll-view 中也不能使用 map、canvas、video 组件。否则会出现很多奇怪的现象


input组件的问题

  • placeholder 文字与 input 的值重叠 暂无解决方法

  • 获取焦点 和 失去焦点 时,光标和文字跳动 暂无解决方法

  • 当 input 设置为居中对齐时,光标会出现在奇怪的位置 暂无解决方法

  • bindconfirm 事件在失去焦点时也会触发,类似于 blur 暂无解决方法

  • 对 input 做动画时,如果是获取焦点状态,会失效 暂无解决方案,因为 input 在获取焦点时是
    native 组件,失去焦点后改回 web 组件

  • type 为 idcard, digit 时并不是调用数字键盘 暂无解决方案,目前起作用的只有 number

  • 在input聚焦期间,不能做css动画,否则input中的placeholder会错位,如果动画和聚焦都想要的话,那么可以在动画完成之后,再设置聚焦



关于数据绑定的问题

小程序更新data后只是把数据的值更新,不会刷新页面,比如滑动的列表不会回到顶部,导致使用swiper有个小bug:

就是swiper的数据是后台请求的,可通过切换tab标签动态获取,如果在切换之前swiper处在第三张或者更多(比将要点击的tab下的swiper多),那切换后swiper会是空白,解决办法是,每次切换要手动初始化swiper的current    属性,使其停留在第一张。


关于生命周期的问题

生命周期函数不要写成箭头函数,否则this会取不到

 切换底部导航时页面不刷新问题,可以用onShow函数掉一次接口重新获取数据解决,或者写一个下拉刷新


图片预览问题

ios没有问题,安卓会黑屏,原因是预览的图片必须是http或https开头的url,相对路径会黑屏


背景图片不显示的问题

这应该是小程序的bug,解决方法:

1. 将背景图片转成base64   2.将图片放到服务器,使用url显示


关于picker组件

1. 触发弹窗时一定要点击在内容上才可触发,点击空白处无效,这个解决看具体需求,比如加个默认值之类的

2. 安卓和ios的样式不一样,如果对这个有要求建议使用第三方组件(如:有赞)


关于post请求

如果要传请求参数,header中要写这个 'content-type': 'application/x-www-form-urlencoded',官方文档说的 'content-type': 'application/json'这个,貌似不管用


小程序没有过滤器

可以用wxs解决,但是要处理传入的value undefined的时候,否则会报错,因为这个方法执行的快一些,数据还没有传过来,当数据传来后又执行一次,第一次很可能undefined


关于小程序码识别的问题

如果二维码识别的是小程序通过 navigate 跳转后的子页面,进入小程序后将回不到首页,因为小程序会认为这是首页,如果有可以回到首页的需求,我的解决办法是,识别后进入首页根据scene参数进行子页跳转


new Date跨平台兼容性问题

在Andriod使用new Date(“2018-05-30 00:00:00”)木有问题,但是在ios下面识别不出来。  因为IOS下面不能识别这种格式,需要用2018/05/30 00:00:00格式。可以使用正则表达式对做字符串替换,将短横替换为斜杠。

var iosDate= date.replace(/-/g, '/');


wx.getSystemInfoSync获取windowHeight不准确:

主要原因在于获取是时机,wx.getSystemInfoSync是在页面初始化的时候就计算了,基本上可以理解为是屏幕高度。所以,最好的方法是使用异步接口,并且在onReady函数中调用。

onReady() {
  wx.getSystemInfo({
    success({windowHeight}) {
      // todo
    }
  });
}


图片本地资源名称,尽量使用小写命名:

在解决iPhone X适配时,底部多余部分使用图片时

<image src="/imgs/iphoneX.png" mode="aspectFill">
路径是 src='imgs/iphoneX.png'></image>

发现在pc IDE上面可以显示出来,但是真机调试时,图片找不到,然后将图片名称改为iphonex.png真机调试就可以了

<image src="/imgs/iphonex.png" mode="aspectFill"></image>


无法获取UnionID的问题

login获取UID必须满足两个条件:

  • 把小程序和公众号都绑定在开放平台
  • 用户必须已经关注公众号

用wx.getUserInfo获取满足一个条件:

  • 把小程序和公众号都绑定在开放平台


wx.getUserInfo()接口更改问题

微信小程序最近被吐槽最多的一个更改,就是用户使用wx.getUserInfo(开发和体验版)时不会弹出授权,正式版不受影响。现在授权方式是需要引导用户点击一个授权按钮,然后再弹出授权。  


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

2.广告联盟: 整理了目前主流的广告联盟平台,如果你有流量,可以作为参考选择适合你的平台点击进入

链接: http://www.fly63.com/article/detial/1472

手把手教你写个小程序定时器管理库

后台的定时器积累得越多,小程序就越卡,耗电量也越大,最终导致程序卡死甚至崩溃。特别是团队开发的项目,很难确保每个成员都正确清理了定时器。因此,写一个定时器管理库来管理定时器的生命周期,将大有裨益。

小程序获取用户信息

其实获取用户信息,一种是获取权限的,一种是不用获取权限,前者获取到的信息更多,包含一些敏感信息,包括给getaccessToken接口需要传的参数,后者就是简单获取一些头像、昵称等信息

微信小程序通过保存图片分享到朋友圈

小程序内是不能直接分享到朋友圈的。所以只能通过生成图片,携带小程序二维码,保存到手机相册,让用户自己选择发到朋友圈。然后可以通过在小程序中识别二维码来进入小程序的指定页面

小程序插件怎么玩?有赞和千万级用户的“群里有事”做了一次示范

小程序插件让大的公司赋能外部开发者变得非常方便,极大降低了中小开发者开发丰富的小程序应用的门槛,未来的发展是很值得期待的。尤其是国庆节前夕,微信公布的关于小程序跳小程序的新政策,极大地限制了不同主体之间小程序互跳的自由度

微信小程序WXS之谜

微信创造了 WXS ,除了提高性能,还有什么原因?WXS(WeiXin Script)是微信创造的一套脚本语言,它的官方说法是:“WXS 与 JavaScript 是不同的语言,有自己的语法,并不和 JavaScript 一致”。

小程序之生成朋友圈图片

微信的小程序是没有分享到朋友圈的功能的。小程序目前只能分享到群里或者发给好友。但是业务需要方便推广,需要分享到朋友圈。得出了以下思路:利用小程序canvas绘制图片,将背景图和二维码绘制成一张图片。

微信小程序页面返回按键控制

今天在开发公司内部的小程序项目时,遇到了一个问题,就是控制手机返回按键的问题,本来我以为很快就可以解决的,没想到最后我用了快一天的时间,才给做好,而且还不是我最初想到的方法。

通过反编译小程序来学习前端

小程序开发时,会有4种文件:.wxss .json .wxs .wxml。正式上传到腾讯时,目录会被打包,使用时再发放给客户端。这个文件包后缀是 .wxapkg。只要手机用过这个小程序,文件包就会缓存在手机内

个人怎么做微信小程序

据说移动互联网的轻量级应用是微信applet。简而言之,applet是基于微信平台的应用程序。目前,小方案的主题非常重要。它通知主要媒体和新闻,以及小程序如何打开。它也在增加,甚至个人也可以开发它

如何探测小程序返回到webview页面?

项目是小程序(wepy), 部分页面使用webview(vue). 经常会遇见一个场景: 当小程序navigateTo到一些页面对用户的收藏状态,做了修改后, 用户点击返回按钮回到上一个页面

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!