初尝微信小程序开发与实践

这可能是一个java程序员最不务正业的一次分享了。

小程序的火热相信不用我多说了,年初的时候老婆去浦东某达面试,甚至都被问有没有小程序测试经验。俨然小程序成为了互联网公司自PC,WAP,安卓,IOS之后又一不可或缺的入口。正好这段时间公司也在做一款小程序,于是顺便也学习了一把。当然因为我是一个后端猿,自然是以后端的视角来谈谈,肯定和前端的同学还是比不上的。

学习小程序,我认为对于后端同学还是比较有优势的,因为后端同学对于HTML,CSS以及JS这些前端基本知识还是有所涉猎的,而前端的同学对于后端可能就没那么了解了。接下来,以我的实践经历来简单聊一聊小程序,算是总结也算是个分享。

小程序用来做什么?

“触手可及”,“用完即走”。感觉这两个词把小程序的特点描述的真的是淋漓尽致。以微信的用户量,小程序免去了用户还需安装APP的繁琐。而且用完之后,无需刻意退出,直接离开即可,当下次某个时间点在想起来,重新翻出来就行了。这对很多行业来说可能是颠覆性的。以我个人的观点来看,小程序适合做一些业务简单,性能要求不高,使用频率相对较低的应用。比如像垂直电商行业就是典型的受益者,自媒体电商,生鲜电商,如果让用户去下载一个这样的APP成本是很大的,而使用小程序确悄然的避免了拉新客的难题。又比如我自己,如果我把自己的博客做成了一个APP,相信几乎不会有同学去下载,而使用小程序却偶尔还会有些同学会点进来看看的,哈哈。

入门小程序

首先开发小程序,需要一个专门的工具【微信开发者工具】,这个大家可以直接到微信公众平台下载。

初尝微信小程序开发与实践

接下来我们首先新建个快速启动模板看一下,如果你有注册账号有appid的可以填入,没有的话也没关系。点击图中小程序即可使用测试账号。

初尝微信小程序开发与实践

如上图,进入后即可看到这些文件。

可以说一个简单的小程序只有这些了。

app.js 主要是全局公共的js方法声明及调用所在的文件

app.json 是小程序全局的配置文件,所以有的页面都在要此注册,不然不允许访问

app.wxss 是小程序全局的css文件

pages下是对应着所有页面,每个页面,可以添加四种类型的文件,.json,.wxss,.wxml,.js

另外在说下这四种类型的文件,小程序pages下面基本上每个文件夹相当于一个页面,每个文件夹下面有四种命名相同但类型不同的文件,这四种构成了页面的全部。

.json 后缀的 JSON 配置文件

.wxml 后缀的 WXML 模板文件,类似web开发的html

.wxss 后缀的 WXSS 样式文件,类似web开发的css

.js 后缀的 JS 脚本逻辑文件,它就是一个js啊,不过小程序的js不能操作dom,是基于数据绑定的哦

然后我们在看下js文件的构成,注释很清晰:

Page({ /** * 页面的初始数据 */ data: { }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () { }, /** * 生命周期函数--监听页面显示 */ onShow: function () { }, /** * 生命周期函数--监听页面隐藏 */ onHide: function () { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function () { }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { }, /** * 页面上拉触底事件的处理函数 */ onReachBottom: function () { }, /** * 用户点击右上角分享 */ onShareAppMessage: function () { } })

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zzfwjd.html