移动软件开发-实验1
一、实验目标
1、学习使用快速启动模板创建小程序的方法;2、学习不使用模板手动创建小程序的方法。
二、实验步骤
列出实验的关键步骤、代码解析、截图。
1.注册小程序账号,获取AppID
登陆微信小程序官网,按照指引注册账号(一个邮箱只能注册一个小程序/公众号账号)
之后填写小程序基本信息,如果选择类型选择了游戏则会直接注册为小游戏账号切不能改为小程序。
填写好基本信息后就可以到设置里查看appid了
本次实验使用测试号,不使用云服务
2.自动创建小程序
3.手动创建小程序
(1)删除无用代码及布局调整
目录
index.wxml
截图:
代码解析:
<!--index.wxml--> <view class='container'> <image src="{{src}}" mode="widthFix"></image>图片链接 <text>{{name}}</text> <button open-type="getUserInfo" bindtap="getMyInfo">点击获取头像和昵称</button>注意是单击事件 </view>
index.wxss
截图:
代码解析:
效果:
(2)添加单击事件,获取微信头像
index.js
通过getUserProfile获取用户信息,代码分析见注释。
三、程序运行结果
列出程序的最终运行结果及截图。
真机调试:
描述实验过程中所遇到的问题,以及是如何解决的。有哪些收获和体会,对于课程的安排有哪些建议。
无法获取微信用户信息
小程序用户头像昵称获取规则调整公告 | 微信开放社区. Developers. https://developers.weixin.qq.com/community/develop/doc/00022c683e8a80b29bed2142b56c01?blockType=1&page=8#comment-list
getUserProfile(e) {
// 推荐使用wx.getUserProfile获取用户信息,开发者每次通过该接口获取用户个人信息均需用户确认,开发者妥善保管用户快速填写的头像昵称,避免重复弹窗
wx.getUserProfile({
desc: '展示用户信息', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
success: (res) => {
console.log(res)
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
})
},
getUserInfo(e) {
// 不推荐使用getUserInfo获取用户信息,预计自2021年4月13日起,getUserInfo将不再弹出弹窗,并直接返回匿名的用户个人信息
console.log(e)
this.setData({
userInfo: e.detail.userInfo,
hasUserInfo: true
})
}
微信小程序开发技术迭代更新非常快,需要不断学习。限制用户信息的获取在一定程度上保护了用户的信息安全。

浙公网安备 33010602011771号