国产视频app在使用百度編輯 UEditor 多張圖片同時上傳時,會發生圖片上成功后,回調時圖片順序被打亂的問題。這主要是因為百度編輯器 UEditor 的圖片上傳接口,會優先處理比較大的圖片,并返回地址。所以圖片順序發生了變化。

解決UEditor編輯器多圖上傳圖片時,圖片順序被打亂的問題的方法

上傳圖片

解決UEditor編輯器多圖上傳圖片時,圖片順序被打亂的問題的方法

上傳成功回調,圖片順序發生變化

針對上面的問題,百度了一些方法,并測試成功!

解決百度 UEditor 編輯器多張上傳圖片被打亂的方法

1、編輯 UEditor/dialogs/attachment/attachment.js 文件

_this.fileList.push(json);

改成

_this.fileList[$file.index()] = json;

解決UEditor編輯器多圖上傳圖片時,圖片順序被打亂的問題的方法

国产视频app為防止上傳失敗的情況,避免數組中出現undefined項,需要加入以下代碼

if (data == 'undefined') {
    continue;
}

解決UEditor編輯器多圖上傳圖片時,圖片順序被打亂的問題的方法

2、編輯 UEditor/dialogs/image/image.js文件

_this.fileList.push(json);

改成

_this.fileList[$file.index()] = json;

解決UEditor編輯器多圖上傳圖片時,圖片順序被打亂的問題的方法

国产视频app為防止上傳失敗的情況,避免數組中出現undefined項,需要加入以下代碼

if (data == 'undefined') {
    continue;
}

解決UEditor編輯器多圖上傳圖片時,圖片順序被打亂的問題的方法

通過以上修改后,再次上傳圖片后,結果如下

解決UEditor編輯器多圖上傳圖片時,圖片順序被打亂的問題的方法