公共组件父子依赖调用及子校验父条件问题解决

<div class="AS-upload">
  <div class="uploaded-list" v-if="uploadFileNameList.length > 0">
    【已上传文件】<span class="file-name" v-for="(name,index) in uploadFileNameList" :key="index">{{ name }}</span>
  </div>
  <div class="upload-header">
    <div class="action-buttons">
      <el-upload
        ref="upload"
        class="upload-demo"
        :action="uploadUrl"
        :headers="headers"
        :data="uploadParams"
        :on-remove="handleRemove"
        :before-remove="beforeRemove"
        :before-upload="beforeUpload"
        :on-change="handleChange"
        :on-success="handleSuccess"
        :on-error="handleError"
        :file-list="fileList"
        :limit="1"
        accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel"
        :auto-upload="false"
      >
        <el-button slot="trigger" size="mini" type="primary">选择表单</el-button>
        <el-button size="mini" type="success" @click="uploadClick">上传</el-button>
      </el-upload>
    </div>
    <div class="tools-buttons">
      <ASTemplateDownload :path="templatePath" :export-name="exportName"></ASTemplateDownload>
    </div>
  </div>
  <div class="upload-footer">
    <el-button size="mini" type="primary" @click="submitBatchAdd">提交</el-button>
    <el-button size="mini" type="default" @click="uploadClose">取消</el-button>
  </div>
</div>

//点击上传
uploadClick() {
  `是否需要校验：${this.isVerify ? '需要' : '不需要'}`
  if (this.isVerify) {
    this.$emit('upload-click', null);
    return false;
  }
  this.uploadHandler();
},
//上传处理函数
uploadHandler() {
  //前置判断：1、必须已选择文件
  if (this.fileList.length === 0 && this.uploadedIds.length === 0) {
    this.$message.error('请先选择要上传的Excel文件');
    return false;
  }
  //判断是否已经上传过文件，已上传的话，调用取消接口，将对应需求单id请求取消接口，清空后端临时数据，清空完成后，清空已上传文件名、id，同时开始触发文件上传逻辑
  if (this.uploadedIds.length !== 0) {
    //抛出上传取消事件
    this.$emit('upload-cancel', this.uploadedIds[0]);
  }
  if (this.fileList.length !== 0) {
    this.uploadLoading = this.$message({
      message: '文件上传中，请稍后...',
      showClose: true,
      iconClass: 'el-icon-loading',
      duration: 0
    })
    this.$refs.upload.submit();
  } else {
    this.$message.error('请先选择一个文件');
  }
},

<!--          父级组件调用组件-->
<ASUpload ref="ASUpload"
          is-verify
          :upload-url="uploadUrl"
          :upload-params="uploadParams"
          template-path="/static/template/xxx.xlsx"
          export-name="xxx.xlsx"
          @close="uploadClose"
          @upload-click="uploadClick"
          @upload-error="uploadError"
          @upload-cancel="uploadCancel"
          @upload-submit="uploadSubmit"
></ASUpload>

//上传前校验
uploadClick(){
  if( !this.uploadVerify()) return false;
  //调用接口等其他业务逻辑
  //...
  //校验完成后，手动调用上传
  this.$refs.ASUpload.uploadHandler();
},

/** props*/
props:{
    //是否需要校验，校验通过后才传入允许上传，传入true，则需要手动调用组件内部的上传方法
    isVerify: {
      type: Boolean,
      default: false,
    },
}
/** methods */
//点击上传
uploadClick() {
  `是否需要校验：${this.isVerify ? '需要' : '不需要'}`
  if (this.isVerify) {
    this.$emit('upload-click', null);
    return false;
  }
  this.uploadHandler();
},