武汉工程大学计算机科学与工程学院 综合设计报告
总 结
本次课题的时间特别短，因此购买功能没有实现，并且该微信小程序的页面不算美观，如果有更多的时间，能够将其变得更加好看，用户的体验能获得一定的提高。
本课题的程序特点介绍： 1. 具有较完善的安全性能，能够在微信相关信息没有被泄露的情况下，保持较高的安全性。
2. 页面模块化的设计思想。本课题在设计页面时采用了模块化处理思想，把页面分成几个模块，例如页面的头、尾、内容等。每个模块都以样式类来实现，页面由这些样式类搭建而成，页面布局文件本身基本不含样式。
3. 统一的样式风格。本课题模仿了淘宝移动端的页面配色，因此页面的风格较为稳定。
程序存在的问题： 1. 购买功能未实现。
2. 没有使用数据库，用户数据在用户退出微信小程序之后无法保存。 3. 页面不太美观。 系统改进建议或设想：
1. 将实现程序的购买功能，并实现购买记录的显示功能。
2. 将使用数据库保存数据，减少程序本身的数据量，使程序更加稳定。让用户数据能够始终保存，不会随着用户的退出而清除。
3. 美化界面，使用户体验提高。
通过这本课程设计，不仅学到了很多专业知识，而且提高了动手能力和解决实际问题的能力，真的受益匪浅。
课题完成到现在，从该开始连业务流程都不怎么熟悉，到现在完成基本需求功能，遇到了不少问题。微信开发者工具没怎么接触，不太熟练，因此常常由于自己的一点失误，或者对某个模块理解得不够充分，导致整个程序的无法运行，经常因为一个问题，致使整个工作无从下手，这时，只有细心的跟踪调试、阅读相关书籍、向老师咨询，仔细检查才能通过。
整个过程中，本人逐渐学会了当遇到问题时应该如何面对，如何寻找最有效的解决方案。学习了系统化的开发思想。相信对以后的学习工作有很大的帮助。
- 13 -
武汉工程大学计算机科学与工程学院 综合设计报告
致 谢
在移动应用系统设计既将完成之际，首先，我要感谢极客营的培训老师，在进行培训期间，程老师和何老师毫无保留的为我提供了相关资料及很多无私的帮助与指导，使我的专业知识和工作能力都得到了很大的提高。其次，还要感谢我的同班同学，在完成课程设计的过程中，我们互相学习，定期交流，针对我的课题他们给了我启发性的建议，开阔了我课题的思路，在完成设计和报告及诸多繁杂事务中，给予我许多无私的帮助。经过多次的讨论，顺利地完成了本次课设。这次课程设计，检验了自己的学习情况，培养了自己发现问题、分析问题、解决问题的能力，同时也发现一些了自己的不足，激励我在以后的学习中不断提高自己。最后，感谢学校给我们提供了这次培训机会，可以说，这次极客营培训让我受益匪浅。
- 14 -
武汉工程大学计算机科学与工程学院 综合设计报告
参考文献
[1] 陈莉莉,刘嘉滢.基于微信小程序的高校早餐外卖O2O电商模式研究——以南京林业
大学为例[J].电子商务,2020(02):38-39.
[2] 袁堂青,亓婧.基于微信小程序的开发与研究[J].网络安全技术与应用,2020(04):66-67. [3] 罗国庆,陈良萍.网站建设案例精粹[M]. 北京: 电子工业出版社, 2004.
[4] 汪涛,杜蔚苗.移动终端HTML5页面互动版式设计研究[J].包装工程,2017,(06):
203-208.
[5] Stephen.R.Schach. Object-Oriented and Classical Software Engineering [M]. 北京: 机
械工业出版社, 2002.
[6] Shari Lavrence Pfleeger. Software Engineering[M]. 北京: 高等教育社, 2003
- 15 -
武汉工程大学计算机科学与工程学院 综合设计报告
附录（程序代码）
//index.js
//获取应用实例 const app = getApp()
Page({ data: {
motto: '欢迎━(*｀?′*)ノ亻!进入水果商城', userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo') },
//事件处理函数
bindViewTap: function() { wx.redirectTo({ url: '../first/first' }) },
onLoad: function () {
if (app.globalData.userInfo) { this.setData({
userInfo: app.globalData.userInfo, hasUserInfo: true })
} else if (this.data.canIUse){
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回 // 所以此处加入 callback 以防止这种情况 app.userInfoReadyCallback = res => { this.setData({
userInfo: res.userInfo, hasUserInfo: true }) } } else {
// 在没有 open-type=getUserInfo 版本的兼容处理 wx.getUserInfo({ success: res => {
app.globalData.userInfo = res.userInfo this.setData({
userInfo: res.userInfo, hasUserInfo: true }) }
- 16 -
武汉工程大学计算机科学与工程学院 综合设计报告
}) } },
getUserInfo: function(e) { console.log(e)
app.globalData.userInfo = e.detail.userInfo this.setData({
userInfo: e.detail.userInfo, hasUserInfo: true }) } })
// pages/first/first.js let col1H = 0; let col2H = 0;
const app = getApp()
Page({
/**
* 页面的初始数据 */ data: {
userInfo: null, banners:[
\
- 17 -
移动应用系统设计
