![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
小程序开发中遇到的问题总结
liya_nan
技术和颜值,总要有一个在路上。
展开
-
小程序优化方案
最近一直在做小程序,开始的时候因为项目太急,功能模块很少,权衡之下选择了原生的小程序开发模式。然后随着功能迭代,小程序的大小又有限制,所以决定开始尽可能的优化项目。下面是用到的一些优化方案:1. wx:if vs hidden 小程序官方文档中描述,wx:if如果在初始渲染条件为false时,框架什么耶不会做,只有当值变为真时,才开始局部渲染。hidden只是简单的控制显示与...原创 2018-07-05 11:07:02 · 16536 阅读 · 0 评论 -
小程序中实现点击一个转发按钮,携带当前点击参数,转发另一个页面的功能
微信官方文档新提供了button的open-type="share"属性,然后js中直接定义onShareAppMessage()方法,旨在更直观的触发用户转发。但是有时候需要转发另一个页面,并且需要将当前点击对象的信息传递到要转发的页面。下面就来展示一下实现过程:wxml:<button class="zanbtn shared" data-item="{{comme...原创 2018-08-13 18:26:14 · 11976 阅读 · 0 评论 -
微信小程序中隐藏右上角转发选项,实现在页面内点击转发按钮转发
最近开发小程序遇到了一个需求,在页面内定义一个转发按钮,只能在页面内点击这个转发按钮才能触发转发,右上角转发隐藏掉。实现效果:页面内部转发按钮:实现方法:微信小程序官方文档中提到,使用wx.hideShareMenu();方法隐藏转发按钮;...原创 2018-08-16 12:13:18 · 25794 阅读 · 4 评论 -
微信小程序canvas组件层级最高问题解决方案
最近产品新提了一个需求,在canvas页面上实现一个弹框。微信小程序文档中有提供cover-view组件,能覆盖canvas,map,video,camera等原生组件。但是也有一定的限制。比如:cover-view中只支持嵌套cover-view、cover-image,button。不可以使用input组件,这与我的需求不相符合,所以只能另辟蹊径。下面来看一下原型图:实现过程中遇到...原创 2018-08-24 18:44:07 · 44546 阅读 · 7 评论 -
微信小程序中的this指向问题
最近开发小程序发现一个很奇怪的问题,有些情况下用 this.setData 可以改变视图显示,有些情况下使用this.setData无效,需 const that = this; that.setData({ xx }); 使用 that 来保存当前的this状态,这样才能更新视图。下来我们就来解释一下,微信小程序中的this指向问题。首先我们来看一段错误代码:handleReadBook(...原创 2018-09-01 13:53:33 · 5649 阅读 · 0 评论 -
微信小程序实现禁止弹框下的scroll-view滚动
最近在做页面优化,发现自己有个有弹框的页面,在弹框出现时底下的scroll-view还是在滚动。这极大的影响了用户体验,下面就来说一下我是如何解决这个问题的。其实解决方案也很简单,给你的弹框添加一个catchtouchmove='true'这个属性,就可以实现效果了。...原创 2018-09-10 10:07:02 · 3327 阅读 · 4 评论 -
微信小程序中web-view的使用,实现小程序与h5页面间跳转
微信小程序文档中提到,web-view组件是一个可以用来承载网页的容器,会自动铺满整个小程序页面。web-view的出现,可以缓解小程序size告急的问题。web-view的使用方法:<!-- wxml --><!-- 指向微信公众平台首页的web-view --><web-view src="https://mp.weixin.qq.com/">...原创 2018-09-11 10:47:43 · 28540 阅读 · 1 评论 -
微信小程序保存活动页面到本地功能实现
效果展示:代码地址:https://github.com/Yana5417/Share/原创 2018-09-26 22:33:39 · 3030 阅读 · 0 评论 -
微信小程序canvas绘制雷达图
效果图展示:代码实现(具体实现):github地址:https://github.com/Yana5417/Radar/调用:// 画雷达图 drawRadar() { const categories = ['故事绘本', '英语教育', '数学教育', '科学教育', '情商教育', '通识教育']; const data = [4, 11, 3,...原创 2018-09-22 20:36:05 · 2896 阅读 · 2 评论