一、初次接触小程序开发
第一次接触小程序开发,有幸与师兄一起参加2018 中国高校计算机大赛 —— 微信小程序应用开发赛,分配的任务是根据小程序界面设计的图片搭建小程序的前端显示框架。主要是学习小程序的界面布局,及相关的小程序组件(https://developers.weixin.qq.com/miniprogram/dev/component/)的使用,搭建好小程序的界面显示框架(即利用小程序开发工具,实现界面设计的显示效果)。
二、二度接触小程序开发
历时一个月,刚刚结束了腾讯微信小程序比赛,又自己组队参加了地质资料创新应用大赛,想要再度借助微信小程序开发工具做个小程序,加深自己对于小程序开发这一块的理解和学习。这次在前面一次参赛的基础上,除了写.wxml和.wxss,开始自己写.js页面里的代码,实现小程序接口传参等功能。
对于一个编程零基础的菜鸟来说,.js页面里的内容要复杂一点。例如接口传参,首先得要明白如何从接口获取数据,然后解析数据,获取要显示的数据,接着重组数据,最后进行传参在界面中显示。需要有一个逻辑思维的过程,没有界面搭建那么简单、直观。
三、总结
好啦~废话不多说,简笔记录一下菜鸟的小程序前端开发的总结:
1、需注意全局变量和局部变量的区别,以及局部变量的使用范围,调用局部变量,可直接用变量名,给全局变量赋值,需要用到this(that).setData({})例如this.setData({a:tempA});//将变量tempA赋给全局变量a;
2、区别数组和字典,二者不能混为一谈,数组用于存放多条类似的数据[],字典用于存放单个对象的数据{};object类型(实体)或字典(dict),可用点语法,获得实体的属性和字典中键名对应的值;数组(array)需通过下标(索引)获取对应位置上的值;
3、区别变量和常量,涉及到定义和赋值的时候何时用“=”,何时用“:”的细节问题(定义变量时用“=”,setData里用“:”);
4、注意!遍历字典很可能会出现顺序错乱的问题,所以为了避免遍历出来的数组元素在使用时出现顺序错乱问题,最好使用字典来存储遍历出来的数组;
5、调用全局变量,需用this(Page对象).data.变量名,Page 是一个页面对象,this表示当前Page对象,即离它最近的对象的内容。因为this是IDE(小程序开发工具)的保留关键字,所以为了跳出IDE对其设定的使用范围,我们需要定义另一个“关键字”(可随意自己定义)来替代this,因此有了“var that = this”(这里that即为另一个“关键字”),当跳出Page对象(如Page外的function函数),使用Page中的变量时,需用that进行传参;
6、在没有完全弄懂或者逻辑思维不够紧密的情况下,尽量避免复制粘贴代码,出现错误会不知所以,找不到头绪,最好手动敲写代码,理清思路,这样有助于纠正细节错误和帮助理解;
7、保存编译出现错误或者无错误但是没有效果反应时,要学会调试代码,打断点,一步一步,找到问题出现在哪一行代码,然后进行修改;
8、最后一个懒人办法,在遇到小程序中某个功能模块不会写(不会理逻辑如何实现)的时候,可以在网上搜索相似的案例,然后自己通过修改案例中的参数大小或名称,摸索案例代码中的每一句代码表示什么意思,并自己进行注释,然后修改实现自己想要写的效果,嵌入到自己的小程序代码中实现该功能。
over~~~