input type="file" 的文件上传 之前界面上需要进行校验，只有校验通过的时候才能打开文件的框，否则给一个提示。

Question

例如：在上传文件前，界面上这个巡检表名称必填，如果为空的话，就给出提示。只有在填上值之后再点击选择文件才会打开选择文件的弹出框。

<div slot="footer" class="dialog-footer">
   <el-button class="file-cancel-btn" @click="showImportContent = false" size="mini" style="">取 消</el-button>
     <a href="javascript:;" class="a-upload" @click="checkBeforeImport">选择文件
        <input id="upload" type="file" @change="importfxx(this)"  accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />
     </a>
</div>

目前禁止非空的提示已经弹出来了，但是文件的弹窗也还是弹出来了，并没有阻止住。

Answer 1

在上面放个遮罩层，条件符合了就移除，不满足就让它盖着。或者捕获父元素的click 阻止默认事件。

Answer 2

先让“选择文件”disable，符合条件了才能触发事件。

Answer 3

preventDefault