# 第一个微信小程序代码存档

代码来自bilibili up主：蒙奇D一休，

功能是实现获取你的头像和用户昵称

一，index.js

  /**   * 页面的初始数据   */  
  data: {    
  name:"Hello World !",    
  src:'/images/wexin.png'  
  },  
  getMyInfo:function(e){    
  console.log(e.detail.userInfo)    
  let info = e.detail.userInfo;    
  this.setData({      
  name:info.nickName,      
  src:info.avatarUrl    
  })  
  },  

二，index.wxml

<!-- 页面内容 -->
<view class="container">  
<image src='{{src}}'></image>  
<text>{{name}}</text>  
<button open-type="getUserInfo"  
bindgetuserinfo="getMyInfo">点击获取头像和昵称</button>
</view>

三，index.json

{  
"usingComponents": {}
}

四，index.wxss

/* 页面样式 */
.container{ 
 height: 100vh; /*视窗大小*/  
 display: flex;/**/  
 flex-direction: column;  
 align-items: center;  
 justify-content: space-around;
 }
image{  
 width: 400rpx; 
 border-radius: 50%;
}
text{  
font-size: 50rpx;  
color: green;
}