微信小程序获取头像和昵称，头像圆角设置

在小程序中，用户的昵称和头像如果只是用来展示，而非用于其它用途，可以直接拿到进行展示：

1.只是用来展示

（1）wxml

<view style='margin:10rpx auto;text-align:center'>
  头像
  <open-data class="open-data-userAvatarUrl" type="userAvatarUrl"></open-data>    
</view>

<view style='margin:40rpx auto;text-align:center;display:flex;justify-content: center;'>
姓名：<open-data class="open-data-userNickName line1" type="userNickName" lang="zh_CN"></open-data>
</view>

<view style='margin:10rpx auto;text-align:center'>
性别：<open-data type="userGender" lang="zh_CN"></open-data>
</view>

(2)wxss

.intro {
  margin: 30px;
  text-align: center;
}

.line1{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis; 
}

.open-data-userAvatarUrl {
  width: 160rpx;
  height: 160rpx;
  display: block;
  overflow: hidden;
  border-radius: 50%;
  margin: 40rpx auto;
}
.open-data-userNickName{
  max-width: 105rpx;
  display:block;
}

(3)效果

2.用于别的用途  （button按钮获取官方地址：官方）

（1）通过页面的按钮，用户授权，这些涉及用户隐私的信息，必须由用户授权，否则无法拿到；

（2）涉及授权的操作必须使用button；

3.说明：

（1）open-data标签不能直接给一个随便的ClassName，须要给一个open-data-classname（classname可以自己变通定义），来实现可以实现头像的倒圆角，如果用户名对长度有要求限制的话也可以通过这种方法来实现限制；

（2）对于有些需要通过用户授权的部分，必须通过按钮来实现，需要授权的参照官网