vue3 uniapp + vant ui 实现上传图片后再次点击上传功能

效果

代码

        起初想用vant ui的chooseFile函数来实现重新上传的文件选择，用了之后没起用。。。改为用uni.chooseImage来实现。

js

const uploadImg = ref(null)
  const handleReUpdate = () => {
    uploadMenu.value = false
    
    // uploadImg.value.chooseFile()
    console.log(uploadList.value)
    
    setTimeout(function() {
      uni.chooseImage({
      	count: 1, //默认9
      	sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
      	sourceType: ['album'], //从相册选择
      	success: function (res) {
          uploadList.value[0].content = res.tempFilePaths[0]
          uploadList.value[0].file = res.tempFiles[0]
      	}
      });
    }, 100);
    
  }
  const handlePreview = () => {
    console.log(222222)
  }
  const afterRead = (file) => {
    // uploadList.value.push(file)
    // 此时可以自行将文件上传至服务器
    // console.log(file);
    // console.log(uploadList.value)
  };
  const handleUpload = () => {
    if(uploadList.value.length > 0){
      uploadMenu.value = true
    }
  }
  const beforeRead = (file) => {
    if (file.type !== 'image/jpeg' && file.type !== 'image/png') {
      Toast.fail('请上传 jpg 或 png 格式图片');
      return false;
    }
    return true;
  }