微信小程序头像昵称填写选择微信昵称时用bindinput获取不到？

如题，对小程序不熟悉。研究昵称、头像填写功能时，发现昵称直接使用微信昵称时不触发bindinput，所以就想用表单提交的方式获取昵称值，不知道哪里写错了，跟着网上的写bindsubmit或是改为catchsubmit，控制台都没有输出formSubmit打印内容。

百度了下好像没有关于这两个的区别wxml

<button class="avatar-wrapper" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar">
  <image class="avatar" src="{{avatarUrl}}"></image>
</button> 
<mp-form bindsubmit="formSubmit">
<mp-cells>
  <mp-cell title="昵称">
    <input type="nickname" name="nc" class="weui-input" bindinput="onInputNickName" placeholder="请输入昵称"/>
  </mp-cell>
  <!-- <mp-cell> -->
    
  <!-- </mp-cell> -->
</mp-cells>
<button class="submit" type="primary" form-type="submit" >提交</button>
</mp-form>

 

js

const defaultAvatarUrl = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    avatarUrl: defaultAvatarUrl,
  },

  onChooseAvatar(e) {
    const { avatarUrl } = e.detail 
    console.log('头像',avatarUrl)
    this.setData({
      avatarUrl,
    })
  },
  onInputNickName(e){
    console.log("输入的值为：",e);
  },
  formSubmit(e){
    console.log('提交的表单数据为:',e)
  }

  
})