小程序开发的40个技术窍门,纯干货!

微信“小程序”正式上线一周时间,相关话题持续升温。支付宝开发“小程序”的消息也随即曝出,互联网巨头们摩拳擦掌,不少网友调侃说,这势头感觉要挑战现有的“APP帝国”了。那么,面对如此炙手可热的小程序,WeX5移动开发云也没有闲着,经过全网搜索,为大家筛选出一条小程序开发者的必读文章,内容涵盖小程序开发实战需要注意的40个技术点,供大家参考!

Q:为什么脚本内不能使用window等对象

A:页面的脚本逻辑是在JsCore中运行,JsCore是一个没有窗口对象的环境,所以不能在脚本中使用window,也无法在脚本中操作组件

Q:为什么 zepto/jquery 无法使用

A:zepto/jquery 会使用到window对象和document对象,所以无法使用。

Q:wx.navigateTo无法打开页面

A:一个应用同时只能打开5个页面,当已经打开了5个页面之后,wx.navigateTo不能正常打开新页面。请避免多层级的交互方式,或者使用wx.redirectTo

Q:样式表不支持级联选择器

A:WXSS支持以.开始的类选择器。

Q:本地资源无法通过 css 获取

A:background-image:可以使用网络图片,或者 base64,或者使用<image/>标签

Q:如何修改窗口的背景色

A:使用 page 标签选择器,可以修改顶层节点的样式

page {

display: block;

min-height: 100%;

background-color: red;

}

Q:为什么上传不成功

A:为了提升体验流畅度,编译后的代码包大小需小于 1MB ,大于 1MB 的代码包将上传失败。

Q:HTTPS 请求不成功

A:tls 仅支持 1.2 及以上版本

Q:网络请求的 referer

A:网络请求的 referer 是不可以设置的,格式固定为 https://servicewechat.com/{appid}/{version}/page-frame.html,其中 {appid} 为小程序的 appid,{version} 为小程序的版本号,版本号为 0 表示为开发版。

Q:不能直接操作 Page.data

A:避免在直接对 Page.data 进行赋值修改,请使用 Page.setData 进行操作才能将数据同步到页面中进行渲染怎么获取用户输入

能够获取用户输入的组件,需要使用组件的属性bindchange将用户的输入内容同步到 AppService。

<input id="myInput" bindchange="bindChange" /><checkbox id="myCheckbox" bindchange="bindChange" />

var inputContent = {}

Page({

data: {

inputContent: {}

},

bindChange: function(e) {

inputContent[e.currentTarget.id] = e.detail.value

}

})

Q:微信小程序支持fetch或者promise吗?

A:promise工具目前不支持,fetch 客户端不支持 工具下个版本保持统一。

Q:touchmove滑动事件里面的currentTarget. id值不变动。

A:ouchmove / touchend 事件的 target / currentTarget 会永远是 touchstart 时的 target / currentTarget 。

Q:wx.request的POST方法的参数传输服务器接收不到的bug。

A:wx.request post 的 content-type 默认为 ‘application/json’

如果服务器没有用到 json 解释的话,可以把 content-type 设置回 urlencoded。

wx.request({

....

method: "POST",

header: {

"content-type": "application/x-www-form-urlencoded"

},

...

})

Q:wx.uploadFile在手机上返回http码403。

A:安卓的微信升级到6.5.2及其以上版本。

Q:小程序SVG支持吗?

A:image的src放远程svg可以,background-image里也可以。

Q:wx.request返回statusCode两端类型不一致。

A:确实有这个问题,稍后的版本将会修复。

Q:关于组件的动态生成与销毁?

A:不支持动态生成组件,但可以用 wx:for 去渲染多个。

Q:小程序支持热更吗?

A:不支持开发者自行更替。

Q:一些接口的回调IOS和Android不一致,例如支付接口,用户取消支付后,ios只回调complete方法,android则回调fail方法,官方文档也没有任何回调说明,造成开发很困难;类似的还有图片选择接口,分享接口等等。

A:支付接口,用户取消支付后,ios只回调complete方法,android则回调fail方法,问题已记录,多谢反馈。

Q:如果icon已经在服务器上了,想用直接访问网址的方法加载图片进来这样可以吗?

A:不能。

Q:ipad不能使用小程序?

A:暂时不支持ipad打开小程序。

Q:小程序音频,视频播放器问题 。1、能够只隐藏进度条跟时间吗?2、现在iOS平台上的时间显示是0:00,但是android上会显示错误码,能够通过什么设置修改吗?

A:1:下个版本会修改这里的交互,不显示进度条和时间。2:6.5.3 版本已修复此问题。

Q:拍照窗口可以加浮层吗?

A:暂时不支持。

Q:开发者工具经常报jsEngineScriptError错误,会导致页面白屏。

A:移步下载最新 0.12.130400 版本的开发工具试试

Q:开发者工具里面,SPA页面,更改title无效。

A:wx.setNavigationBarTitle可以通过 API 改变导航栏标题。

Q:请问小程序页内支持长按保存图片或分享图片吗?

A:目前没有这个功能。

Q:关于swiper中的current问题。如果在新的版本中,直接设current,会产生的效果是:无论从哪个swiper元素点击进去,都会显示swiper第一个子元素的值。

A:目前swiper在处理swiper-item动态变化的情况时有一些bug,会很快修复的。

Q:小程序能引用自己服务器上的wxss和js文件吗?

A:不能,无法执行远程代码。

Q:苹果7,提示内部错误,内存占用过多。

A:页面做的预加载,列表中有图片,图片渲染的太多了,解决办法就是不当屏展示的图片,不让它渲染。

Q:小程序体验者安卓卡在加载页面进不去,IOS可以进去。

A:这是android微信客户端旧版本的bug, 请下载最新版本的 6.5.3 客户端。

Q:请问目前微信小程序支持蓝牙吗?

A:目前不支持。

Q:分享功能真机没有效果?

A:这是android微信客户端旧版本的bug, 请下载最新版本的 6.5.3 客户端。

Q:强制使用https,开发和测试环境下怎么联调和测试?

A:「微信web开发者工具」->「项目」->「开发环境不校验请求域名及TLS版本」。

Q:wx.showToast()方法无效。

调用wx.request请求网络然后在

complete: function (res) {

// complete

wx.hideToast();

}

在成功方法里面如果要进行showToast的时候感觉无效,并没有弹出提示框。

A:success 回调调用是在 complete 之前的,如果在 success showToast,下一步 complete hideToast 就会被冲掉showToast。

Q:picker 组件中的文字大小是否支持修改?

A:不支持修改。

Q:tabBar的图片在android和ios上面大小差异太大。

A:这是android微信客户端旧版本的bug, 请下载最新版本的 6.5.3 客户端

Q:tabbar 页面返回问题。非首页的tabbar 页面 点击左上角返回箭头时如何返回到小程序首页? 现在是直接退出小程序了

A:创建新页面时用 navigateTo 才会新建新页面,同时保留旧页面,如果用 redirectTo 是在当前页面内跳转。

Q:问下 wx.request() 怎么设置成同步。

A:reqeust是发起网络请求。没有同步接口。

Q:最新mac版工具不可用,进来就出现获取appservice 失败。

A:工具设置中选择直接链接网络 。或者 系统中的代理软件设置工具直接链接网络。

Q:真机 view overflow-y下滑会很卡。

A:父层需要 position:relative; 加了之后就不卡了。

以上就是干货分享的主要内容,需要提醒的是,小程序本身还在不断调整、修改、完善之中,对陆续发现的BUG,也需要进行相应的修复。关心小程序开发的朋友请关注我们,获取最新的小程序开发干货。

更多精彩内容:

1、送“微信”聊天工具源码,5天用WeX5开发出来(by S.Chat,大图慎入!)

2、微信应用号「小程序」最全的Q&A列表

3、全是干货!UI设计的30条黄金准则!

4、铛铛移动IM源码最新版(8月11日发布)!Apache开源的业务型企业移动IM

5、起步科技高薪直招,待遇优厚!岗位说明都在这里!



HTML5 App开发用WeX5

开源、免费,极速秒开!

时间: 2024-10-05 23:50:25

小程序开发的40个技术窍门,纯干货!的相关文章

春哥技术博客:商城类小程序开发全过程

商城类小程序是所有类别小程序中开发的热点,但其相对于其他类别的小程序,具有逻辑复杂.功能需求较大等特点,因此,对开发者具有一定的基础要求.那我们就止步于前了吗? 当然不! 春哥源码团队,本文主要讲述商城小程序开发的过程,并附上了源码,希望对各个开发者能有所帮助. 一.明确项目需求 在开发小程序之前,需要明确,商城类小程序有哪些基本功能和需求. 需求如下: 二.账号注册 后端开发难度太大,可以直接使用支持小程序开发的后端平台,注册账号:www.bmob.cn 三.目录结构设计 四.设计与开发 详细

商超行业微信小程序开发定制一般多少钱 (行业技术人员解读)

商超行业微信小程序开发多少钱?如果想要开发一个商超行业微信小程序大概得 需要多少钱呢?随着时代的发展小程序已经逐渐取代了很多传统APP的存在. 越来越多的品牌和企业个人都将小程序的开发作为首要目标,这也足以证明小程 序的优势是非常大的.那么下面我们就来说一说小程序开发大概需要多少钱. 一.模板开发模板开发具体步骤 模板小程序开发多少钱?首先在小程序开发之前必须搞清楚自己的需求,如果你 想要开发的小程序功能比较普遍,跟市面上的小程序基本相似,而且同样的商业 形态还很多的话,比方说网店.商城.分销系

微信小程序开发视频教程

课程:拜师学艺,微信小程序从入门到大神必经之路(第一季,共四季) 课程观看地址:http://www.xuetuwuyou.com/course/172/lesson/list 课程出自学途无忧网:http://www.xuetuwuyou.com 讲师:风舞烟 课时列表: 第一部_诞生 - 天降大任:名门贵族,互联网开发新宠--小程序横空出世 第1章 : 忽如一夜春风来--小程序的前世今生 课时1:课程开场 课时2:本章目标及任务 课时3:第一回合_小王子出世-微信小程序_小程序为什么这么火

共享链商业小程序开发系统定制

共享链商业小程序开发系统定制(共享链开发找何经理-188.264.66502微/电)共享链小程序开发.共享链系统开发等.众多企业在当下互联网购物的大潮下面临着前所未有的巨大的考验和挑战,生意之路越来越坎坷艰难,即使他们产品品质优良,服务到位,但往往还是要面临门庭冷落,经营困难的局面.迫使线下商家入驻某团等大型电商平台,效果初期显著(平台尚未火爆,在发育期),但是发展到当前,平台成型之后,大量从商家销售额中进行抽成.这样一来,商家利润降低的同时,消费者的购买价同样还是居高不下,局面开始慢慢僵住.但

小程序&#183;巧应用,微信小程序开发实战

系统全面地讲解微信小程序的开发技术.开篇创建一个小程序项目并解析体验,介绍如何由零开始创建一个小程序,全面体验小程序的开发工具.界面.开发框架.实现过程及其主要代码框架,了解小程序的应用场景及开发要求.接着介绍小程序开发基础,包括小程序开发的语言与语法.函数方法.模块.事件交互等.然后详细介绍了组件的应用与开发,包括开发过程与组件应用技巧,还详细分析了API接口,包括使用各个微信原生API接口进行小程序开发的技巧.最后介绍了几个小程序实战案例,让读者实践小程序各项能力的应用及掌握一些应用技巧.本

微信小程序开发 --02

微信小程序在开发中,难度系数不是很大,其中应用的技术也是web开发中常用的技术,虽然在微信开发者工具中的叫法与常见的web开发的叫法不太一样. 首先,在微信小程序开发中,代码文件格式大体有以下四中: .wxml .wxss .js .json 首先,wxml后缀的文件类似于html和xml的结合,例如在html中常用的div在微信小程序开发中被替换成了view,而在html中输出文本用的p标签被替换成了text标签,引入图像由html中的img 标签变成了image标签,等等.如果你之前开发的w

微信小程序开发教程

9月21日晚发布的微信公众平台·小程序内侧邀请,微信应用号(小程序,「应用号」的新称呼)终于来了!目前还处于内测阶段,微信只邀请了部分企业参与封测.想必大家都关心应用号的最终形态到底是什么样子? 怎样将一个「服务号」改造成为「小程序」?相信很多技术人员开始关注,会不会取代APP开发,一些职位会不会被取代. 现在带你一步步创建完成一个微信小程序,并可以在手机上体验该小程序的实际效果.这个小程序的首页将会显示欢迎语以及当前用户的微信头像,点击头像,可以在新开的页面中查看当前小程序的启动日志.下载源码

微信小程序开发入门教程

做任何程序开发要首先找到其官方文档,微信小程序目前还在邀请内测阶段,目前官方放出了部分开发文档,经过笔者一天的查看和尝试,感觉文档并不全面,但是通过这些文档已经能够看出其大概面貌了.闲话不多说,我们先来看看其有哪些官方文档. 微信公众平台开发者文档统一入口为:https://mp.weixin.qq.com/wiki,这里面大部分内容都是以前就有的,微信开发都是基于此份文档. 现在的变化是在这份文档的顶部加了一个“微信公众平台.小程序”的入口,这个入口才就是专门针对微信小程序开发的文档,如下图:

小程序开发运营必看:微信小程序平台运营规范

一.原则及相关说明 ? 微信最核心的价值,就是连接——提供一对一.一对多和多对多的连接方式,从而实现人与人.人与智能终端.人与社交化娱乐.人与硬件设备的连接,同时连接服务.资讯.商业. ? 微信团队一直致力于将微信打造成一个强大的.全方位的服务工具.在此基础上,我们推出了微信小程序这个产品,提供给微信小程序的开发者在微信内搭建和实现特定服务.功能的平台.通过全面开放的能力,我们将更多连接的可能给予企业和服务提供者,并为微信小程序提供基础的接入能力.运营环境和规则体系,进而帮助更多的企业和服务提供