vue 導出功能


按鈕:

<el-button type="primary" @click="exportBtn" class="ml20">導出</el-button>

方法:先調接口

      exportBtn(){
        if(this.tableData.length === 0 ){
          this.$message.error('暫無數據,無法導出')
        }else{
          let url = `/manage/business/activity/cdk/exchange/export`
          let pames = {
            page: this.pageNum,
            pageSize: this.pageSize,
            type: this.type
          }
          openForm(url, pames, "POST")
        }
      },

打開方法:

/**
 * @method 創建一個表單並提交
 *  @param {String} url 提交的地址
 * @param {Object} params 提交的數據
 * @param {String} method 提交的方式
 */
export const openForm = (url, params, method) => {
  const form = _createElement(({
    tag: 'form',
    attr: {
      id: 'newsForm',
      name: 'newsForm',
      target: '_blank',
      method: method,
      action: url
    }
  }))
  Object.keys(params).forEach(item=>{
    let input = document.createElement('input')
    input.type = 'text'
    input.name = item
    input.value = params[item]
    form.appendChild(input)
  })
  document.body.appendChild(form)
  form.submit()
  document.body.removeChild(form)
}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM