实现el-upload组件上传图片并修改图片

Question

vue3使用el-upload组件上传图片，实现的功能：上传一张图片，上传成功后显示，并且可以再次上传图片并替换上一张（类似上传头像并修改头像），怎么实现 ？
我这边遇到的问题：
上传图片后控制台报错，页面也没有显示上传的图片：

可以帮我看看我的代码是哪里的问题吗 ？

      <el-upload action="" list-type="picture-card" :auto-upload="false" :on-change="uploadHeadImage" :before-remove="removeHeadImage" ref="uploadFile">
        <template v-if="object.haveHeadImage !== 0">
          <img id="trigger-img" :src="imageUrl" alt="" />
        </template>
        <el-icon v-else>
          <Plus />
        </el-icon>
        <template #tip>1.格式为png或者jpg 2.且不能大于2M</template>
        <template #file>
          <span></span>
        </template>
      </el-upload>

const object = reactive({
  detail: {},
  confidentialInfo: {},
  conversation: [],
  haveHeadImage: 0, // 是否已经上传图片
  headImageFile: '' // 上传的图片文件
})
// const imageUrl = ref('')
const uploadFile = ref()
const haveImg = ref('')
const imageUrl = computed({
  // get: () => {
  //   if (haveImg.value) {
  //     return haveImg.value
  //   }    else {
  //     return process.env.VUE_APP_BASE_URL + '/head/'
  //   }
  // },
  set: (value) => {
    haveImg.value = value
  }
})

// 上传图片
function uploadHeadImage(file) {
  console.log('图片', file);
  object.haveHeadImage = 1
  object.headImageFile = file.raw
  imageUrl.value = file.url
  uploadFile.value.clearFiles()
}
function removeHeadImage() {
  object.haveHeadImage = 0
}

Answer 1

<el-upload class="uploader poster-uploader" :auto-upload="false" :show-file-list="false" :on-change="handlePosterChange">
    <img v-if="dialogForm.posterImg" :src="dialogForm.posterImg" class="uploader-img" />
    <Icon v-else name="el-icon-Plus" />
</el-upload>




const handlePosterChange = async (uploadFile) => {
  if (uploadFile.raw.type !== "image/jpeg" && uploadFile.raw.type !== "image/png" && uploadFile.raw.type !== "image/webp") {
    ElNotification.warning("图片仅支持JPG/PNG/webp格式");
    return;
  }

  state.formData.poster = uploadFile;
  state.posterStatus = true;
  dialogForm.posterImg = URL.createObjectURL(uploadFile.raw);
};

这是我的，获取到值直接赋值就行了