vue+ElementUI項目中，上傳控件為必填項，上傳圖片后清空提示信息

(ps:以下是我在項目中遇到得問題及解決方法，希望對你們有幫助。如果還有其他方法，可以留言，謝謝)

一個表單頁面，使用element-ui中el-upload上傳圖片，此項為必填項，然后寫了校驗規則，當不上傳圖片時，會提示請上傳圖片，當上傳圖片后，提示不會消失；

代碼如下：

 <el-form-item label="XXX" ref="image" prop='imageUrl'>

     <el-upload class="avatar-uploader" :action="actionUrl" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">

          <img v-if="form.demo" :src="form.demo" class="avatar">

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

     </el-upload>

</el-form-item>

校驗規則：

　　imageUrl:[{

               required: true,

               message: '請上傳',

       }]

如何清楚這個提示信息呢？我們也許會用官網上得這幾行代碼如下：

this.$refs[formName].validate((valid) => {
          if (valid) {
            
          } else {
           
          }
 });

經過我在項目中，驗證顯然是沒有達到預期得效果。這樣也是會有問題，會影響其他的校驗內容。經過查詢資料，找到了一個比較好得方法。

想要清空原來上傳圖片下方的提示信息，只需要在上傳組件上綁定ref，在on-success鈎子中調用this.$refs.XXX.clearFiles()，就可以清除。

代碼如下：

　　handleAvatarSuccess(res, file) {

                this.$refs.image.clearValidate();

        }