断断续续的学习,有不对之处,望各位大神指点。
前面的基本属于基础,属于面子工程,就是给你的小程序披上一层美丽的外衣,是静态的。后续会慢慢的了解微信晓城的API,努力去使用。(据说vue和小程序的有点类似,学过vue的对小程序容易上手)
1.运用组件获取
![](https://img.haomeiwen.com/i3353227/8c7a4b3d7cf27694.png)
open-data的type值.png
案例:
微信小程序中,可以直接使用 来获取微信的相关信息。在没有点击授权的情况下,直接获取,不要写js。
![](https://img.haomeiwen.com/i3353227/10e0c57c3f8124cb.png)
效果图.png
![](https://img.haomeiwen.com/i3353227/ce4c19137a2c08e1.png)
wxml.png
2.点击按钮获取相关信息(版本更新后的授权)
根据微信小程序范例button组件介绍
![](https://img.haomeiwen.com/i3353227/74ab777610f3f912.png)
button组件.png
![](https://img.haomeiwen.com/i3353227/b8e2829222b7fcb3.png)
button组件.png
![](https://img.haomeiwen.com/i3353227/3ff3d8d3409af206.png)
button组件的open-data.png
![](https://img.haomeiwen.com/i3353227/eb93b707dfcbb283.png)
授权.png
![](https://img.haomeiwen.com/i3353227/10e0c57c3f8124cb.png)
效果图.png
![](https://img.haomeiwen.com/i3353227/f3e24e4c2481a6ab.png)
wxml.png
根据button组件中open-data属性,点击button,获取用户相关信息。通过判断(wx:if,wx:else)是否存在hasUserInfo和canIUse,来进行页面上表现形式。
js
1.判断button中的open-data是否被支持
![](https://img.haomeiwen.com/i3353227/cb12944a7b5ac72b.png)
image.png
2.设置一些默认值
![](https://img.haomeiwen.com/i3353227/60b9ce0c8682b63e.png)
image.png
用hasUserInfo来作为if的判断
3.点击按钮事件bindgetuserinfo="getUserInfo"
![](https://img.haomeiwen.com/i3353227/9ac3834797c351fd.png)
image.png
bindgetuserinfo:用户点击该按钮时,会返回获取到的用户信息,回调的detail数据与wx.getUserInfo返回的一致
扫码体验
![](https://img.haomeiwen.com/i8885956/43e3b6560d4a4263.jpg)
网友评论