关于使用tableExport.js下载是不能自己命名的问题

前几天做了一个表格下载的功能,使用的是tableExport.js,这个js文件在公共组件里面,所以就拿来直接用了,功能倒也没有什么问题,可以正常的下载。
然后客户又提了一个需求,需要下载的时候能够根据下载不同的报表进行命名,当时想想问题不大,做的时候摸索了一番才做出来。翻阅了很多资料,可是按照网上说得方法并没有行的通,这里我总结一下,以便大家参考。(ps:第一次写博客,写的不好见谅!)
网上的教程是传一个fileName的参数就OK了,可是我试了半天,传进去的参数并没有用,于是翻了一下公共组件里面的js,头部有作者的GitHub地址,地址是:https://github.com/kayalshri/tableExport.jquery.plugin
就进去看了下,发现好多人也有这样的问题,其中一位大牛提供了一个很好的方法——将源码中的一行代码替换掉,如果你也是从这个GitHub地址下载的话,可以参考我的方法。
这是源码:

window.open(\'data:application/vnd.ms-\'+defaults.type+\';filename=exportData.doc;\' +  64data);

需要改为:

$(\'<a style=\"display:none\" href=\"data:application/vnd.ms-\'+defaults.type+\';filename=exportData.doc;\'+ 64data+\'\" download=\"\'+defaults.tableName.toString()+\'.xls\"><span></span></a>\').appendTo(document.body).find(\'span\').trigger(\"click\").parent().remove();

在需要导出表格的地方这样写:

$(this.nrwGrid).treeTableExport({type:\'excel\',escape:\'false\',htmlContent:\'true\',  : filename,fileName:filename});

这里我写的fliename是一个变量,是拼接的一个文件名,fileName将会传给treeTableExport的,这里要注意的是 , 是你下载完表格的时候表格的表头,如下图:
\"在这里插入图片描述\"
然后在tableExport.js中将tableName的值改为options.fileName就可以了。

$.fn.extend({
            treeTableExport: function(options) {
                var defaults = {
						 : \'\',
						separator: \',\',
						ignoreColumn: [],
						tableName:options.fileName,
						type:\'csv\',
						pdfFontSize:14,
						pdfLeftMargin:20,
						escape:\'true\',
						htmlContent:\'false\',
						consoleLog:\'false\'
				};

这样就可以在下载的时候实现你想要的命名啦!
如果你觉得麻烦,那么请下载这个地址的tableExport:https://tableexport.v3.travismclarke.com/
这个只需要在下载表格的时候传入fileName就可以了,而不需要动源码。希望能在大家提供帮助,也欢迎大家指出不当指出,感谢!

收藏 打印