Vol.1 微信小程序之初识
# 引入
在开始之前,先总结一下我之前学过的技术栈吧。
截止2021-1-1,我曾经已经有非常多的PC端程序开发经验(使用VB、VB.NET、C#),写过不少功能完善的桌面应用程序,但对美观方面并不在意,只有ShadowPlayer项目的UI还算过得去。但这些都是高中阶段的开发成果了,大学阶段除了给老师定制的简单随机器和倒计时器也没有再开发过客户端程序。顺带提一句,VB和VB.net我已经放弃了,他们是很优秀的入门语言,但是我现在还是更加喜欢C#,C#是世界上最好的编程语言!也许之后有空我可以继续使用C#进行ASP.NET或Unity开发。
大学阶段主要学习了Web开发,也是通过直接做项目上手,最先从一个简单的纯html的静态页面开始入手,到用PHP写的前后端耦合的简单作业列表平台,再到PHP写的同样前后端耦合的大项目——学生学习平台,它也是我学习Vue的起点。至此,我对Web开发已经非常熟练了。不过确实有短板在CSS上,我只能使用CSS做一些比较简单的调整而且还不熟练,那种漂亮的页面我没办法用CSS做出来,CSS感觉他不讲武德,学起来和编程语言感觉不太一样。项目基本都是用的UI库比如光年(Light Year Admin)后台管理系统模板、ElementUI。再接着作为队长参加了大创,项目进行前后端分离,我也是顺便对后端开发比较熟练了,当然是最简单的,不考虑高并发的增删改查,用的laravel。
上面说到的学生学习平台本来是针对PC端开发的,因为element对手机端没有提供支持,我的CSS技术也不足以完成良好的手机端适配,刚好这次借着这次短学期的机会学习一下微信小程序开发,计划提供一个简单的手机端应用。
# 初始微信小程序
我这个人就不喜欢看什么视频入门,我觉得看视频效率非常低下而且往往看完了视频上手去做的时候感觉刚才看的啥都不记得。因此我想学习Vue一样,直接去看文档。可能是之前看了Vue的官方文档的关系(Vue的官方文档写得非常好),看了微信小程序的文档之后...emmmmm一眼难尽啊...只有前面的基本格式介绍写的还行(或许也是因为我有Vue基础,因为微信小程序的wxml和Vue基本是一样的格式),后面的文档写的实在是不能再乱,而且有些还写的不完全。很明显的,我要找一个东西永远要翻很久才会在另一个页面里找到描述。或许是因为这个小程序文档不只是单单面向开发者吧?
吐槽完了再来总结一下微信小程序的基本技术架构吧。微信小程序最核心的有四种类型文件:.json
、.wxml
、.wxss
、.js
。Json文件用来静态配置一些参数,Wxml文件类似html文件,指定小程序的基本界面元素UI。Wxss文件基本就等同于css文件。js文件则是编写页面逻辑代码的地方。项目都有的app.js
、app.json
、app.wxss
分别指定了全局逻辑代码、全局配置和全局样式。每个小程序页面都由该页面文件夹下的四个.json
、.wxml
、.wxss
、.js
文件实现。小程序的开发基本就是这种全局+页面1+页面2...的形式。
Wxml和html、Vue非常相似,只不过标签名字和html的不太一样,具体的数值表达式格式和Vue基本没有区别。在这种相似度下我觉得小程序开发起来远没有Vue舒服,它似乎不支持Vue里的Compute
变量,或者直接用函数作为表达式的值。而且JS里对data变量的值都要使用setData
进行赋值,我觉得这很麻烦。
Wxss基本就是css,只不过添加了尺寸单位rpx
,文档里说的仅支持部分css选择器我暂时还没有深入了解,不过css选择器我本来也就了解不多。