微信小程序 案例 学习 1

//index.js//获取应用实例var app = getApp()Page({  data: {    welcome: '欢迎来到微信小程序',  userimage:'获取域名',    chouseImages:'上传图片',    userInfo: {},    tempFilePaths:''  },  //事件处理函数  bindViewTap: function() {  wx.navigateTo({      url: '../logs/logs'    })  },  bindUserImage:function(){    wx.navigateTo({      url:'../users/images'    })  },  chooseimage:function(){    var _this = this    wx.chooseImage({      count: 1,      sizeType: ['original', 'compressed'],       sourceType: ['album', 'camera'],      success: function (res) {        _this.setData({            tempFilePaths:res.tempFilePaths          })        }    })  },  onLoad: function () {    console.log('onLoad')    var that = this    //调用应用实例的方法获取全局数据    app.getUserInfo(function(userInfo){      //更新数据      that.setData({        userInfo:userInfo      })      console.log(userInfo);    })  }})index.wxml<!--index.wxml--><view class="container">  <view  bindtap="bindViewTap" class="userinfo">    <image class="userinfo-avatar" src="{{userInfo.avatarUrl}}" background-size="cover"></image>    <text class="userinfo-nickname">{{userInfo.nickName}}</text>  </view>  <view class="usermotto">    <text class="user-motto">{{welcome}}</text>  </view>  <view bindtap="bindUserImage" class="userimage">    <text class="user-image">{{userimage}}</text>  </view>  <button class="userimage" bindtap="chooseimage">{{chouseImages}}</button><image src="{{tempFilePaths}}"  /></view>/**index.wxss**/.userinfo {  display: flex;  flex-direction: column;  align-items: center;}.userinfo-avatar {  width: 128rpx;  height: 128rpx;  margin: 20rpx;  border-radius: 50%;}.userinfo-nickname {  color: #aaa;}.usermotto {  margin-top: 100px;}.userimage{  margin-top: 20px;  color: #aaa;}.userimage img{  width: 10px;  height: 10px;}