el-upload自定义触发按钮及触发上传前判断

1. 在页面中引用el-upload组件

<!-- 自定义按钮div -->
  
<div 
  v-if="routerList.length !== 1"
  class="action upload" 
  :class="{action_upload_radius: routerList.length === 1}"
  @click="uploadHandler"
>
  <i class="el-icon el-icon-upload"></i>上传
</div>
    
<!-- hidden upload -->
    
<el-upload
  v-show="false"
  class="upload-demo"
  :action="uploadUrl"
  :on-success="actionUploadSucc"
  :show-file-list="false"
  :headers="headers"
  :data="actUploadParams"
  :multiple="false"
  :file-list="fileList">
  <el-button ref="file-home-uploadBtnRef" v-show="false">
    <i class="el-icon-upload"></i>上传文件
  </el-button>
</el-upload>

使用一个div模拟一个上传按钮，使用v-show隐藏upload组件，在upload组件的触发按钮el-button上绑定ref

2. 触发前条件判断及触发upload上传方式

    // action bar 上传btn
    uploadHandler () {
      console.log(this.routerList);
      const len = this.routerList.length
      if(this.routerList.length === 1) return this.$message.info('请先进入文件夹！')
      const currFolderId = this.routerList[len-1].folderId // 当前操作的文件夹id
      this.actUploadParams.folderId = currFolderId
      // 触发upload组件上传
      this.$refs['file-home-uploadBtnRef'].$el.click()
    },

获取到upload触发按钮el-button的ref，在获取到ref上的$el，调用click()自点击触发upload上传