<view class="warp"> <view> <view class="userPic"> <image src="{{userInfo.avatarUrl}}"></image> <text>{{userInfo.nickName}}</text> </view> </view> <view class="myOrder"> <view class="clearfix br"> <text class="fl">我的订单</text> <text class="fr">></text> </view> <view class="clearfix paylist"> <view class="fl" bindtap="no_handle"> <image src="../../image/pay1.png"></image> <span>待付款</span> </view> <view class="fr" bindtap="handle"> <image src="../../image/payed1.png"></image> <span>已付款</span> </view> </view> </view> <view class="myAddress clearfix br" bindtap="toAddress"> <text class="fl">我的地址</text> <span class="fr">></span> </view> </view> |
page{background-color: #fff;} .warp{padding: 0 30rpx;font-family: "微软雅黑";color: #000;font-size: 30rpx;} .userPic { display: flex; flex-direction: column; align-items: center; margin-bottom: 30rpx; } .userPic image { width: 128rpx; height: 128rpx; margin: 20rpx; border-radius: 50%; } .userPic text{ color: #aaa; } /*.userPic{width: 200rpx;height: 200rpx;}*/ .myOrder,.myAddress{line-height:80rpx;padding:0 20rpx;border-top: 1px #e6e6e6 solid;} .myOrder{margin-bottom:40rpx;} .myOrder .paylist{border-top: 1px #e6e6e6 solid} .myOrder .paylist view{width:305rpx;text-align: center;} .myOrder .paylist view image{width:60rpx;height: 60rpx;display: block;margin: 20rpx auto 0 } .myAddress{border-bottom: 1px #e6e6e6 solid;} |
var app = getApp(); Page({ data:{ userInfo:{} }, onLoad: function () { var that = this //调用应用实例的方法获取全局数据 app.getUserInfo(function(userInfo){ //更新数据 that.setData({ userInfo:userInfo }) }) }, //跳转到编辑地址等信息页面 toAddress:function(){ wx.navigateTo({ url: '../address/address', success: function(res){ // success }, fail: function() { // fail }, complete: function() { // complete } }) }, //跳转到订单列表 no_handle:function(e){ wx.navigateTo({ url: '../orderList/orderList?type=no_handle', success: function(res){ // success }, fail: function() { // fail }, complete: function() { // complete } }) }, handle:function(e){ wx.navigateTo({ url: '../orderList/orderList?type=handle', success: function(res){ // success }, fail: function() { // fail }, complete: function() { // complete } }) } }) |
模板简介:该模板名称为【微信小程序白色背景简洁的个人中心页面样式模板制作设计下载】,大小是,文档格式为.,推荐使用打开,作品中的图片,文字等数据均可修改,图片请在作品中选中图片替换即可,文字修改直接点击文字修改即可,您也可以新增或修改作品中的内容,该模板来自用户分享,如有侵权行为请联系网站客服处理。欢迎来懒人模板【小程序教程】栏目查找您需要的精美模板。