小程序开发（1）：登录，退出，本地缓存，在线客服以及问题反馈

1.登录授权，退出

点击登录按钮，底部弹出询问授权框，用户点击确认获取用户基本信息，并将用户信息缓存本地，以避免后期进入小程序。再次授权

1。在wxml页面设置登录按钮，并绑定登录事件，同时添加wx：if="{{！userInfo}}"判断登录情况，如果登录则隐藏登录按钮

//小程序登录
<button wx:if="{{!userInfo}}" bindtap="login">授权登录</button>

2.在js中设置用户数据userInfo，并添加对应逻辑函数，使用小程序提供的getUserProfile获取用户信息，同时用wx.setStorageSync('user', user)来储存用户信息缓存

data: {
  userInfo:""
  },

//授权登录
login:function(){
  wx.getUserProfile({
    desc: '授权获取更多权益！',
    success:res=>{
    let user=res.userInfo
    // 设置缓存
    wx.setStorageSync('user', user)
    this.setData({
    userInfo:user
      })
    },
    fail:err=>{
      console.log(err)
    }
  })
},

在js页面的onLoad函数中读取相应缓存，这样除非用户主动清理，缓存就会一直在本地，下次进入小程序就直接在登录状态

 /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // 读取本地缓存
    let user=wx.getStorageSync('user')
    this.setData({
      userInfo:user
    })
    console.log(user)

退出并清理缓存
在wxml页面添加退出登录按钮

<button  bindtap="loginout">退出登录</button>

js中逻辑代码

// 退出登录清理缓存
loginout:function(){
// 清理缓存
this.setData({
userInfo:""
})
//清理缓存
wx.setStorageSync('user', null)
},

2.在线客服，反馈信息

1，在线客服，在wxml页面设置buttom按钮添加open-type="contact"属性。同时在小程序后台添加在线客服

<button open-type="contact" >在线客服</button>

此功能只能在真机模拟下演示
{用户视角}


（客服视角）


2.问题反馈
在wxml页面添加open-type="feedback"按钮

<button open-type="feedback">问题反馈</button>

（客服视角）
用户视角


（注：此端口也能投诉当前小程序）