微信小程序实战

一、引言

      在做完ssm+vue的简单项目之后,很想再来尝试小程序,于是今天便开启了小程序的开发。今日学习计划大概:早上大致看一下文档,了解一下组件的使用以及文件结构;大致了解之后,下午便尝试着开发。

二、准备工作

1、注册微信公众号(之前已注册过,记住ID,开发时需要用;百度搜索微信公众号平台即可)

2、下载微信开发工具(在公众号平台之中)

3、文档查看(微信公众号平台之中)

微信小程序实战
三、开发步骤
   1.搭建基本目录
   2.在wxml中进行页面组件摆放 ,wxss进行设计布局,js进行操作,和前端基本上差不多;
   3.在app.json进行导航栏布局(先在阿里库进行图标选取,十分精致)
   4.界面优化

效果:
微信小程序实战
微信小程序实战
微信小程序实战
问题记录:

(1)底部出现空白部分
进行page容器的margin、padding设置(嘿嘿,基础没有学好,掌握这几个对于布局很重要,,建议多阅读官方文档(MDN),多实战)
(2)报错不显示
多半在于wxss的问题

心得:
学了前端(HTML,CSS,JS)还是蛮快的,接下来学习和后端交互,以及调用其有趣的功能。。

源码: https://github.com/lyf712/wxdemo.git
欢迎下载,若有错误欢迎指出,感谢!