一个Ext JS 6可用的下载类

栏目: JavaScript · 发布时间: 6年前

内容简介:版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/tianxiaode/article/details/83081460

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/tianxiaode/article/details/83081460

HTML5为A标签添加了download属性,可用来指定链接的文件名,单击A标签后就可实现文件下载功能,该组件就是利用这个特性来实现的,具体代码如下:

Ext.define('Admin.util.Download', {
    alternateClassName: 'DL',
    singleton: true,

    saveAs: function(url,filename, fileType, params){
        Ext.Ajax.request({
            method: 'GET',
            url: url,
            params: params,
            filename: filename,
            binary: true,
            success: function(response, options){
                Ext.Msg.hide();
                let filename= options.filename,
                    bytes = response.responseBytes,
                    blob = new Blob([bytes], {type:fileType});
                    a = document.createElement("a"),
                    evt = document.createEvent("MouseEvents");
                a.innerHTML = filename;
                a.download = filename;                    
                a.href = URL.createObjectURL(blob);
                evt.initEvent("click", false, false);
                a.dispatchEvent(evt);        
            },
            failure: FAILED.ajax
        }) 
    }

});

下载类 Admin.util.Download 为单例模式的列,也就是不需要实例化就可直接调用 saveSa 方法,如果不喜欢使用单例模式,也可将 saveAs 方法修改为静态方法。

调用 saveAs 方法需要传递文件名(filename)、文件类型(fileType)和提交参数(params)这三个参数。

saveAs 方法内,会调用Ajax去获取下载文件。要注意的是,在调用Ajax时,将数据返回格式设置为了二进制格式( binary: true )。在成功获取文件后,就可使用响应的 responseBytes 属性来获取返回的字节流,然后将字节流转换为 blob 对象,这里要注意是必须设置好文件类型,不然下载后的文件可能是非预期的。在创建blob对象后,就可创建一个A标签了。在创建A标签时,需要绑定它的鼠标事件和 innerHtml 等属性,而最关键就是将下载的文件名绑定到 download 属性,并为 blob 对象创建一个访问地址赋值给A标签的 href 属性。最后就是调用A标签的单击事件来实现文件下载操作了。


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

痛点

痛点

马丁·林斯特龙 / 陈亚萍 / 中信出版集团股份有限公司 / 2017-4-1 / CNY 49.00

互联网经济迅猛发展,大数据成为分析用户需求的一种惯性路径。世界首席品牌营销专家林斯特龙则指出,大数据连接了千百万的数据点,可以准确地产生相互关系。但是,当人类按照自己的习惯行动时,大数据分析通常不会十分准确。所以挖掘用户需求时,在大数据之外,更重要的是通过对一个小群体的亲身观察和小数据常识,捕捉到这个社会群体所体现出的文化欲望。满足这些用户需求,击中痛点,则意味着将掌握无限的商机。一起来看看 《痛点》 这本书的介绍吧!

SHA 加密
SHA 加密

SHA 加密工具

HEX CMYK 转换工具
HEX CMYK 转换工具

HEX CMYK 互转工具

HSV CMYK 转换工具
HSV CMYK 转换工具

HSV CMYK互换工具