欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  互联网

微信小程序商项目(篇9)用户页面实现

程序员文章站 2022-07-01 16:23:38
用户背景区域 {{userInfo.user....

用户背景区域

<!-- 背景 -->
<block wx:if="{{userInfo.userInfo}}">
    <view class="myBackground" >
        <image mode="widthFix" class="headPic" src="{{userInfo.userInfo.avatarUrl}}" />
        <view class="userName" >{{userInfo.userInfo.nickName}}</view>
    </view>
</block>
<block wx:else>
    <view class="noBackground">
        <button class="loginBtn" type="primary" plain="{{true}}" bindtap="getQuan">登录</button>
    </view>
</block>

收藏区域

<view class="collect">
    <view class="collect1">
        <view>0</view>
        <view class="collectBottom">收藏的店铺</view>
    </view>
    <view class="collect2">
        <view>0</view>
        <view class="collectBottom"> 收藏的商品</view>
    </view>
    <view class="collect3">
        <view>0</view>
        <view class="collectBottom">关注的商品</view>
    </view>
    <view class="collect4">
        <view>0</view>
        <view class="collectBottom">我的足迹</view>
    </view>
</view>

订单区域

<view class="orderTitle">我的订单</view>
<view class="myOrder">
    <view class="myOrderTop">全部订单</view>
    <view class="myOrderTop">待付款</view>
    <view class="myOrderTop">待收货</view>
    <view class="myOrderTop">退款/退货</view>
</view>

其他

<view class="item">收货地址管理</view>
<view  class="item">联系客服</view>
<view  class="item"> 意见反馈</view>
<view  class="item">关于我们</view>

获取用户信息

  onShow: function () {
    wx.login({
      timeout:10000,
      success: (result)=>{
        // console.log(result)
        wx.setStorageSync("token", result.code);
      },
      fail: ()=>{},
      complete: ()=>{}
    });
    const userInfo=wx.getStorageSync("userInfo");
    // console.log(userInfo)
    this.setData({
      userInfo:userInfo
    })
  }

去登录页面

  getQuan(){
    wx.navigateTo({
      url: '/pages/login/login'
    });
  }

登录页面

<button type="primary" 
plain="{{true}}" class="loginBtn" 
open-type="getUserInfo"  
bindgetuserinfo="getQuan">授权</button>
  getQuan(e){
    console.log(e)
    const userInfo=e.detail
    wx.setStorage({
      key: 'userInfo',
      data: userInfo
    });
    wx.navigateBack({
      delta: 1
    });
  }

本文地址:https://blog.csdn.net/weixin_40119412/article/details/108568612