关于"bootstrap fileinput"获取服务器上的文件信息，然后在控件中进行显示，并且显示下载按钮。就这个功能，耗费了我很长时间来研究这个控件，现在将解决方法记录一下。
网上有很多方法，我不能说我的方法是一定正确的，但是在修改源码的过程中，我阅读了一下源码，发现可以通过设置相关的属性来显示下载按钮，特此记录！
网络上的方法（可行）
https://www.jianshu.com/p/4bd0e1b6d15a
我的方法
首先，获取从服务器获取到的文件列表，并设置“bootstrap fileinput”的initialPreview和initialPreviewConfig这两个属性。
上述的两个属性怎么来的呢？首先，我们在fileinput.js这个文件里面，找到_renderFileActions方法，网络上的方法就是让你添加
if(showUpl){
otherButtons = '';
}
这样的代码来进行判断.但是,我们看_renderFileActions方法,
_renderFileActions: function (
cfg,
showUpl,
showDwn, //看这个属性
showDel,
showZoom,
showDrag,
disabled,
url,
key,
isInit,
dUrl,
dFile
)
看到没有，人家明明有showDwn这个属性，为什么不直接用呢？然后我们在fileinput中设置showDownload: true，发现并不其作用，为什么呢？然后接着看哪些地方调用了_renderFileActions方法，然后我们从源码的一开始进行查找，会发现footer: function这个函数，仔细看这个方法中的内容，
image.png
你会发现我标红的三行代码，一个是判断是否有showDownload这个设置，还有就是，你的配置信息中是否有dowmloadUrl这个属性，如果都有，那么sDwl就是true，缺失任何一个就是false;
showDownload可以直接在初始化fileinput的时候设置，那么dowmloadUrl在那设置呢？
这时，我们看config.downloadUrl这个，config指向的就是initialPreviewConfig的信息，现在问题迎刃而解。
看下面的代码！
//为initialPreviewConfig 配置数组
var initPrevConfig = new Array();
var imgUrls = new Array();
$(files).each(function (index,item) {
initPrevConfig[index] = {
caption: item.accessoryName, /*文件标题*/
size:Number(item.accessorySize),
downloadUrl: item.accessoryUrl, //这个是显示下载按钮的关键，如果没有此属性，下载按钮是不会显示的。
url: prefix +"/accessory/remove", /* 预览中的删除按钮的url*/
key: item.id, /* 删除时ajax携带的参数*/
extra: {ids: item.id} /*删除文件携带的参数*/
};
imgUrls.push(item.accessoryUrl);
});
控件的设置
$("#accessory").fileinput({
overwriteInitial: true, // 覆盖初始预览内容和标题设置
showClose:false, //是否显示关闭按钮
showCancel:true, // 显示取消按钮
showCaption: false,
showZoom:true, // 显示预览按钮
dropZoneEnabled:false, // 是否可拖拽
showUpload: false,
browseLabel: '选择附件', // 浏览按钮内容
showRemove:false, // 显示移除按钮
hideThumbnailContent:true, // 是否隐藏文件内容
msgUploadEnd: '上传完成',
initialPreviewAsData: true,
showPreview: true,
initialPreview: imgUrls, //你的变量
initialPreviewConfig: initPrevConfig , //你的配置
fileActionSettings: { // 在预览窗口中为新选择的文件缩略图设置文件操作的对象配置
showRemove: true, // 显示删除按钮
showUpload: false, // 显示上传按钮
showDownload: true, // 显示下载按钮 （这个也很重要）
showZoom: false, // 显示预览按钮
showDrag: false, // 显示拖拽
removeIcon: '<i class="fa fa-trash"></i>', // 删除图标
uploadIcon: '<i class="fa fa-upload"></i>', // 上传图标
uploadRetryIcon: '<i class="fa fa-repeat"></i>' // 重试图标
}
})
完成后的效果
image.png
