小程序中头像昵称填写

官方文档

参考小程序用户头像昵称获取规则调整公告
新的小程序版本不能通过wx.getUserProfile和wx.getUserInfo获取用户信息

      <van-field label="{{Avatar}}" label-class="field-label" right-icon-class="field-right-icon-class"input-class="field-input" input-align="right" readonly><view slot="right-icon" class="right-icon"><button class="right-icon__btn" open-type="chooseAvatar" bindchooseavatar="getAvater"style="border: 1px solid;"></button><image class="right-icon__avatar" src="{{userinfo.avatarUrl}}" /></view></van-field><van-field label="{{Name}}" required label-class="field-label" error-message="{{nicknameMessage}}" input-class="field-input" input-align="right"><input slot="input" value="{{ userinfo.nickname }}"  type="nickname" class="right-input field-input" placeholder="{{PleaseInput}}{{Name}}"placeholder-style="color: #c4c4c4"  maxlength="{{30}}" bind:input="changeName" bind:change="changeName" /></van-field>

注意昵称填写，同时绑定了input和change事件（input是用户输入时触发，change是直接选择微信昵称时触发）

    getAvater(event) {console.log(9, event);console.log('event', event.detail.avatarUrl);this.setData({changeAvatar: true,userinfo: Object.assign({}, this.data.userinfo, {avatarUrl: event.detail.avatarUrl,})})},changeName(e) {console.log('e.detail.value', e.detail.value);this.setData({userinfo: Object.assign({}, this.data.userinfo, {nickname: e.detail.value}),nicknameMessage: !e.detail.value ? this.data.PleaseInput + this.data.Name : '',})},