之前是这样写的

  watch:{   //watch()监听某个值（双向绑定）的变化，从而达到change事件监听的效果
        user:{
          handler:function(){
            let _this = this;
            let _sum = 10; //用户姓名字体限制为10个
            _this.$refs.userName.setAttribute("maxlength",_sum);
            _this.number= _sum- _this.$refs.userName.value.length;

          },
          deep:true
        }
      },

之后项目中需要的watch的数据用到了v-if（之后加的） 一直报错 因为v-else是数据渲染以后 我才能找到_this.$refs.userName 所以一直报错

  <van-loading v-if="dataLoading" />
      <div v-else class="edit-content">
        <van-cell-group>
          <!--<van-field v-model.trim="user.name" @blur="checkUserName" placeholder="请输入用户名" />-->

          <div class="van-cell van-field">
            <div class="van-cell__value van-cell__value--alone">
              <div class="van-field__body"><input type="text"  v-model.trim="user.name" @blur="checkUserName"  placeholder="请输入用户名" ref="userName" class="van-field__control">
              </div>
            </div>
          </div>

        </van-cell-group>
  </div>     

之后参考这个博客 https://blog.csdn.net/qingwazange/article/details/75507029
改成这个样子，created是渲染数据的

 created(){
        const Vthis = this
        let flag = Vthis.getId()
        if(!flag){
          Toast('系统错误');
          return
        }
        Vthis.getDetail()

      },
      mounted(){
        const Vthis = this
        Vthis.$watch('user', function(){
          let _sum = 10; //用户姓名字体限制为10个
          Vthis.$refs.userName.setAttribute("maxlength",_sum);
          Vthis.number= _sum- Vthis.$refs.userName.value.length;
        }, {deep: true})
      },