欢迎光临,了解微信小程序开发,就上易用通!

Real--微信小程序开发之路(二)

发布:2018-04-25 09:15浏览: 来源:网络 作者:cola

上周由于国庆小长假的缘故未能及时更新文章,在此说声抱歉,之后将继续周更。

好久没有写有关微信小程序的文章了,今天继续讲讲小程序的一些容易踩到的“坑”。

一、图片上传须使用wx.uploadFile(),而不是使用wx.request()

微信小程序专门提供了一个用于上传文件的API,那就是wx.uploadFile()。如果想要上传图片,同样得用该方法,并且一般情况下都是要与wx.chooseImage()结合使用。通过wx.chooseImage()可以选择本地图片或者直接拍照而返回一个临时的图片路径,再将这个临时路径传入wx.uploadFile()中后通过第三方服务器返回线上路径,这样之后我们才能随时获取到这张图片。

当然,有时候我们也可能在提交表单的时候需要提交图片,这时候我们才要用到wx.request(),提交的图片路径就是通过wx.uploadFile()返回的线上路径,而不是通过wx.chooseImage()返回的临时路径。

这两个方法的具体用法可以直接参考开发文档:https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-file.html#wxuploadfileobject。

二、微信小程序的加载动画家族

1. 下拉刷新动画

Real--微信小程序开发之路(二)(图1)

① onPullDownRefresh()
在 Page 中定义 onPullDownRefresh 处理函数,监听该页面用户下拉刷新事件,需要用户手动下拉才能触发。

② enablePullDownRefresh
需要在config(文件后缀为.json)的window选项中设置enablePullDownRefresh为true后onPullDownRefresh()才有效。

③ wx.startPullDownRefresh()
开始下拉刷新,调用后触发下拉刷新动画,效果与用户手动下拉刷新一致,使用该方法无需用户手动下拉也能触发下拉刷新动画。

④ wx.stopPullDownRefresh()
当处理完数据刷新后,wx.stopPullDownRefresh可以停止当前页面的下拉刷新动画。

2. 导航条加载动画

Real--微信小程序开发之路(二)(图2)

① wx.showNavigationBarLoading()
在当前页面显示导航条加载动画。

② wx.hideNavigationBarLoading()
隐藏导航条加载动画。

3. 提示框加载动画

Real--微信小程序开发之路(二)(图3)

① wx.showLoading()
显示 loading 提示框, 需主动调用wx.hideLoading()才能关闭提示框。

② wx.hideLoading()
隐藏 loading 提示框。

三、page.json只能设置 app.json 中的 window 配置项的内容,并且不能写window这个键

这个“坑”看起来虽小,但是一旦你一不小心踩到了,很可能很难发现问题所在,因为就算你在page.json中写法与app.json一致,也就是说把window这个键也写进去了,小程序并不会报错,只是不会出现你想要的效果。

比如,你只想在某个页面实现下拉刷新效果,那么你在该页面的 config 中可以这样配置:

{
  "navigationBarTitleText": "下拉刷新动画",
  "enablePullDownRefresh": true
}

但是,如果你一不小心在前面加了个"window":,那么问题就来了,页面这时无法实现下拉刷新,然后你说我明明配置了"enablePullDownRefresh": true啊,接着就很有可能在这个小问题上纠结很久,所以需要谨记:page.json中不能写window这个键。

四、微信小程序中含有Imoji图片的用户昵称存储问题如何解决?

这里涉及后端数据库的问题,有时候提交表单时需要获取用户昵称并提交到数据库,但是有些用户昵称中会带有Imoji图片,这时直接保存到数据库可能会出现无法识别的问题,解决方法是将数据库字段格式改成utf8mb4格式就好。






免责声明:本站所有文章和图片均来自用户分享和网络收集,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系网站客服处理。