(三)vue下载模板功能--本地下载

html


js:


ok() {
                let params = {
                    tempType:'traffic_police'
                }
                this.$http({
                    method: 'get',
                    responseType: 'blob',//防止返回乱码
                    // url: '/static/fileExcel/buy.xlsx',//正式
                    url: 'http://localhost:8082/static/fileExcel/buy.xlsx',//测试
                    params: params
                }).then(res=>{
                    console.log(res.data.status)
                    if(res.status == '200'){
                        // downloadFile (data, name)
                        let data = res.data;
                        if (!data) {
                            this.$message.error('下载失败,解析数据为空!')
                            return
                        }
                        // const datetime = Date.now();
                        // 创建一个新的url,此url指向新建的Blob对象
                        let url = window.URL.createObjectURL(new Blob([data]))
                        // 创建a标签,并隐藏改a标签
                        let link = document.createElement('a')
                        link.style.display = 'none'
                        // a标签的href属性指定下载链接
                        link.href = url
                        //setAttribute() 方法添加指定的属性,并为其赋指定的值。
                        let fileName = '购买明细表.xlsx'
                        link.setAttribute('download', fileName )
                        document.body.appendChild(link)
                        link.click()
                        this.$Message.info('导出成功');
                        this.modal3 = false;
                    }else{
                        this.$Message.error('导出失败,请尝试重新导出');
                    }
                });
            }

你可能感兴趣的:((三)vue下载模板功能--本地下载)