$("#file").fileinput({
showUpload:false,
overwriteInitial:false,
maxFileCount:5,
initialPreview: [
"<img src='/profile/avatar/2019/08/29/d21d8a43f67ba3d7c07be23263e1b581.jpg'
class='file-preview-image kv-preview-data'
style='width:auto;height:auto;max-width:100%;max-height:100%;'>",
"<img src='/profile/avatar/2019/08/29/a2e0318c7bdc2b1cb02845bb0d43912d.jpg'
class='file-preview-image kv-preview-data'
style='width:auto;height:auto;max-width:100%;max-height:100%;'>",
],
initialPreviewConfig: [
{caption: '0bd5cc2106_hd.jpg', url: '/pic/remove',
key: 4, extra: {id: 4} },
{caption: '97di-htfpvza3930503.jpg', url: '/pic/remove',
key: 5, extra: {id: 5} },
],
fileActionSettings: {
showRemove: true,
showUpload: false,
showDownload: false,
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>'
}
});
編輯頁面:從數據表獲取圖片數據並顯示,主要是【initialPreview】【initialPreviewConfig】這兩個參數,本人是在後臺把這兩個配置組裝好再傳值到前臺顯示的。
效果圖:
API:https://segmentfault.com/a/1190000018477200?utm_source=tag-newest#articleHeader5