如今,微信小程序大火,各种抽奖锦鲤遍野,于是就想去试着玩玩微信小程序的开发,看着wx小程序官方开发文档,其代码结构如同web前端一样,分为wxss、wxml和js,就觉得反正h5没有深入使用过,通过轻量级的h5应用小程序来接触了解web前端。本文也就由此诞生了。
https://developers.weixin.qq.com/miniprogram/dev/index.html(wx小程序官方开发文档)
1.开发工具安装
小程序代码程序的开发脱离不了开发工具,这里用官网提供的开发者工具进行开发。下载地址如下:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html?t=19020120
2.代码框架
pages包含了所有开发设计的页面;utils包里是公共js代码函数;app.json是该小程序的全局配置信息,pages字段下是该小程序所有的页面url,第一个url默认为首页
windows字段下是该小程序顶部信息(背景色,标题,字体色等),更多字段信息查看https://developers.weixin.qq.com/miniprogram/dev/framework/config.html;
app.wxss类似于h5中的css样式,属全局范围,描述wxml组件的样式;app.js是本小程序的操作脚本代码,在这个文件中处理小程序的生命周期函数、声明全局变量,并且可以调用 API等。
3.小程序开发
整个小程序的代码结构就如上所述,微信小程序开发主要还是针对pages里的页面进行设计开发。
每个页面都