element-ui的在el-dialog中el-upload上传一张图片后显示缩略图并隐藏添加图片按钮，关闭后再次显示添加图片按钮

<el-dialog

          :title="title"

          :visible.sync="open"

          width="40%"

          @closed="handleDialogClosed"//关闭dialog，执行清除逻辑

        >

<el-form

            ref="formData"

            :model="formData"

            label-width="120px"

            :rules="rules"

          >

<el-form-item label="图标" prop="logo" required>

                  <el-upload

                    :class="{ disabled: uploadDisabled }"//设置是否显示upload

                    ref="upload"

                    :limit="1"

                    :headers="header"

                    list-type="picture-card"

                    :action="'你的上传地址'"

                    :on-exceed="exceeded"

                    :on-success="uploadImg"

                    :before-upload="beforeAvatarUpload"

                    :on-change="uploadSectionFile"

                    :on-remove="handleRemove"

                  >

                    <img v-if="imageUrl" :src="imageUrl" class="avatar" />

                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>

                  </el-upload>

                </el-form-item>

</el-form>

</el-dialog>

data(){

return{

uploadDisabled: false,

}

}

methods: {

uploadSectionFile(file, fileList) {

      if (fileList.length >= 1) {

        this.uploadDisabled = true;

      }

    },

    handleRemove(file) {

      this.uploadDisabled = false;

    },

handleDialogClosed() {

      this.formData = {};

      this.imageUrl = "";

      this.$refs.upload.clearFiles();

      this.uploadDisabled = false;

    },

}
<style scoped>

::v-deep(.disabled .el-upload--picture-card) {

  display: none !important;

}

</style>