標簽:圖標 支持 開發實戰 direct 菜單欄 tst 推薦 ref type
小程序打開後第一個進入的頁面
前往iconfont-阿里巴巴矢量圖標库下载圖標。
未選中unselected顔色:#8a8a8a
選中selected顔色:#f83b23
?頁面配置 | 微信开放文档
屬性 | 描述 |
---|---|
navigationBarBackgroundColor | 導航欄背景顔色,如 #000000 |
navigationBarTextStyle | 導航欄標題顔色,僅支持 black / white |
navigationBarTitleText | 導航欄標題文字內容 |
?开放接口 /用户信息 /wx.getUserProfile
<view class="container">
<view class="userinfo">
<block wx:if="{{!hasUserInfo}}">
<button wx:if="{{canIUseGetUserProfile}}" bindtap="getUserProfile"> 获取头像昵称 </button>
<button wx:else open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
</block>
<block wx:else>
<image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
<text class="userinfo-nickname">{{userInfo.nickName}}</text>
</block>
</view>
</view>
Page({
data: {
userInfo: {},
hasUserInfo: false,
canIUseGetUserProfile: false,
},
onLoad() {
if (wx.getUserProfile) {
this.setData({
canIUseGetUserProfile: true
})
}
},
getUserProfile(e) {
// 推薦使用wx.getUserProfile获取用户信息,开发者每次通过该接口获取用户个人信息均需用户确认
// 开发者妥善保管用户快速填写的头像昵称,避免重复弹窗
wx.getUserProfile({
desc: ‘用于完善會員资料‘, // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
success: (res) => {
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
})
},
})
?路由 /wx.redirectTo| 微信开放文档
关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。
?界面 /交互 /wx.showLoading| 微信开放文档
显示 loading 提示框。需主动调用 wx.hideLoading 才能关闭提示框
?界面 /交互 /wx.hideLoading| 微信开放文档
隐藏 loading 提示框
在app.js中的globalData一般是用來存儲全局變量的。
globalData: {
user: {}, //后台返回用户全部信息
userInfo: {}, //微信获取用户信息
}
標簽:圖標 支持 開發實戰 direct 菜單欄 tst 推薦 ref type
原文地址:https://www.cnblogs.com/zhulu506/p/14966806.html