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) }
越努力越幸运