element el-uploadは、画像をアップロードした後、アップロードを非表示にします

これが直接コードであり、自分でテストすることができます。
ここでは、1枚の写真をアップロードした後にのみアップロードボタンを非表示にします。複数の写真をアップロードする必要がある場合は、制限属性を自分で変更できます。

<template>
    <el-card class="card">
      <el-upload
        :class="{hide:hideUploadEdit}"
        :headers="this.headers"
        :action="this.url.fileUpload"
        :on-preview="handlePicPreview"
        :on-remove="handlePicRemove"
        :on-success="handlePicSuccess"
        :on-change="handlePicChange"
        :file-list="fileList"
        :limit="1"
        list-type="picture-card">
        <i slot="default" class="el-icon-plus"></i>
      </el-upload>

      <el-dialog :visible.sync="dialogVisible">
        <img width="100%" :src="dialogImageUrl" alt="">
      </el-dialog>
    </el-card>

</template>

<script>
  import Vue from "vue";
  import {
    
    ACCESS_TOKEN} from "@/store/mutation-types"

  export default {
    
    
    name: "MachCheck",
    data() {
    
    
      return {
    
    
        dialogImageUrl: '',
        dialogVisible: false,  // 大图预览框
        hideUploadEdit: false, // 是否隐藏上传按钮
        headers: {
    
    },
        fileList: [],
        url: {
    
    
          fileUpload: window._CONFIG['domianURL'] + "/sys/common/upload", // 上传地址
        },
      }
    },
    created() {
    
    
      /* 获取token头信息 */
      const token = Vue.ls.get(ACCESS_TOKEN);
      this.headers = {
    
    "X-Access-Token": token}
    },
    methods: {
    
    
      /* 上传后和删除后都要判断是否隐藏 */
      handlePicRemove(file, fileList) {
    
    
      	// 大于1张隐藏
        this.hideUploadEdit = fileList.length >= 1
      },
      handlePicChange(file, fileList) {
    
    
        // 大于1张隐藏
        this.hideUploadEdit = fileList.length >= 1
      },
      handlePicPreview(file) {
    
    
        this.dialogImageUrl = file.url;
        this.dialogVisible = true;
      },
      handlePicSuccess(response, file, fileList) {
    
    
        console.log(response, file, fileList);
      },
    }
  }
</script>

<style>
  .hide .el-upload--picture-card {
    
    
    display: none;
  }
</style>

アップロードする前に：

アップロード後：

ヒント：質問や技術的なやり取りがある場合は、ペンギン：995062855を追加してください。あなたの来ることを示してください、