小程序项目
本文最后更新于 459 天前,其中的信息可能已经有所发展或是发生改变。

获取用户信息

wxml

<!--pages/contact/contact.wxml-->
<view wx:if="{{!userInfo}}">
  <radio></radio>
  <checkbox></checkbox>
  <view>{{m1.toUpper(username)}}</view>
  <view>{{m2.toLower(country)}}</view>
  <input type="text" placeholder="请输入账号" />
  <input type="password" placeholder="输入密码" />
  <button type="primary" bindtap="login">登录</button>
</view>
<!-- 登录成功 -->
<view class="root" wx:else>
  <image src="{{userInfo.avatarUrl}}" class="img"> </image>
  <view class="name">{{userInfo.nickName}}</view>
</view>
<wxs src="/tools.wxs" module="m2"></wxs>
<wxs module="m1">
  module.exports.toUpper = function (str) {
    return str.toUpperCase()
  }
</wxs>

获取用户登录数据,包含逻辑推理

第一种(以注释掉)由于es5语法this指向需要let一个全局变量,对下面数据修改的时候使用

使用最基本的判断

第二种简写利用登录信息直接判断

// pages/contact/contact.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    username: 'liyunlong',
    country: 'WAND',
    userInfo: ''
    // nickName: '',
    // avatarUrl: '',
    // islogin: true
  },
  // login() {
  //   console.log('执行了', this);
  //   let that = this
  //   wx.getUserProfile({
  //     desc: '必须授权才可以使用',
  //     success(res) {
  //       console.log('授权成功', res.userInfo);
  //       // console.log('内部this',this);
  //       console.log('that', that);
  //           nickName: user.nickName,
  // avatarUrl: user.avatarUrl,
  // islogin: false
  //       that.setData({
  //         nickName:res.userInfo.nickName
  //       })
  //     },
  //     fail(res) {
  //       console.log('授权失败', res);
  //     }
  //   })
  // },

  login() {
    console.log('执行了', this);
    wx.getUserProfile({
      desc: '必须授权才可以使用',
      success: res => {
        let user = res.userInfo
        console.log('授权成功', user);
        this.setData({
          userInfo: user
        })
      },
      fail: res => {
        console.log('授权失败', res);
      }
    })
  },
})
上一篇
下一篇