handleAvatarSuccessres file thisimageUrl = URLcreateObjectURLfileraw; thisinsertFormimage = res; consolelogthisinsertFormimage; beforeAvatarUploadfile const isJPG = filety

要实现在Vue.js中监听对象的变化，并在编辑信息上传头像后导航栏的头像也一起改变，可以通过以下步骤实现：

1. 在Vue组件的data选项中定义一个变量，用于保存导航栏的头像信息，例如：

data() {
  return {
    imageUrl: '',
    navAvatar: ''
  }
},

2. 在handleAvatarSuccess方法中，将上传头像成功后的图片地址赋值给imageUrl，并将res保存到insertForm.image中，例如：

handleAvatarSuccess(res, file) {
  this.imageUrl = URL.createObjectURL(file.raw);
  this.insertForm.image = res;
  this.navAvatar = res; // 将res保存到navAvatar中
  console.log(this.insertForm.image);
},

3. 在导航栏组件中，使用计算属性或监听器监听navAvatar的变化，从而实时更新导航栏的头像，例如：

// 计算属性方式
computed: {
  navAvatarUrl() {
    return this.navAvatar ? 'your_base_url' + this.navAvatar : '默认头像地址';
  }
}

// 监听器方式
watch: {
  navAvatar(newVal, oldVal) {
    this.navAvatarUrl = newVal ? 'your_base_url' + newVal : '默认头像地址';
  }
}

4. 在导航栏组件的模板中，使用navAvatarUrl绑定头像的src属性，例如：

<img :src="navAvatarUrl" alt="导航栏头像" />

这样，当编辑信息上传头像成功后，导航栏的头像也会实时改变