更新图片base64

project/pidu/app/AppSensitive/components/Detail.vue

@@ -81,7 +81,7 @@
                 </div>
 
                 <div class="img-list" v-if="item.msgType == 'image'">
-                  <img :src="item.sdkFileUrl" alt="" v-viewer>
+                  <img :src="item.src" alt="" v-viewer>
                 </div>
 
                 <div class="voice-info" v-if="item.msgType == 'voice'">
@@ -508,6 +508,14 @@
               if(item.msgType == 'location') {
                 this.initMap(item.lng, item.lat, item.zoom, index)
               }
+              if (item.msgType == "image") {
+                var image = new Image();
+                image.crossOrigin = '';
+                image.src = item.sdkFileUrl
+                image.onload = ()=>{
+                  this.$set(this.msgList[index], 'src', this.getBase64Image(image))
+                }
+              }
             })
             this.msgList = this.msgCurrent > 1 ? [ ...res.data.records, ...this.msgList]: res.data.records
             this.msgPages = res.data.pages || 2
@@ -520,12 +528,24 @@
               }
               
             })
+            
           }
           this.isLoading = false
         }).catch(() => {
           this.isLoading = false
         })
       },
+      getBase64Image(img) {
+        var canvas = document.createElement("canvas");
+        canvas.width = img.width;
+        canvas.height = img.height;
+
+        var ctx = canvas.getContext("2d");
+        ctx.drawImage(img, 0, 0, img.width, img.height);
+        var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
+        var dataURL = canvas.toDataURL("image/"+ext);
+        return dataURL;
+      },
       getMsgListPre() { //下拉加载上一页
         this.instance.post(`/app/appsessionarchiveinfo/list`, null, {
           params: {

project/pidu/app/AppSessionArchive/components/Detail.vue

@@ -586,7 +586,9 @@ export default {
                 image.crossOrigin = '';
                 image.src = item.sdkFileUrl
                 image.onload = ()=>{
-                  item.src = this.getBase64Image(image);
+                  this.$set(this.msgList[index], 'src', this.getBase64Image(image))
+                  // item.src = this.getBase64Image(image);
+                  // console.log(this.getBase64Image(image))
                 }
               }
             });
@@ -609,6 +611,7 @@ export default {
               }
             });
           }
+          this.$forceUpdate()
           this.isLoading = false;
         })
         .catch(() => {