更新

src/views/hot-music-more/index.module.less

@@ -465,9 +465,9 @@
   }
 
   .subjectItem4 {
-    width: 23.4%;
+    width: 23%;
     margin-left: 0 !important;
-    margin-right: 1.6% !important;
+    margin-right: 2% !important;
 
     &:nth-child(4n) {
       margin-right: 0 !important;
@@ -482,7 +482,8 @@
 .popupMusicDetail {
   :global {
     .van-popup__close-icon {
-      font-size: 16px;
+      font-size: 18px;
+      font-weight: bold;
       color: #aaa;
       padding: 10px;
       top: 14px;

src/views/hot-music-more/music-detail/index.module.less

@@ -3,6 +3,7 @@
     position: relative;
     height: 300px;
     overflow: hidden;
+    background-color: #fff;
     &::before {
       pointer-events: none;
       content: ' ';
@@ -21,6 +22,15 @@
     display: flex;
     flex-direction: column;
 
+    &.downContainer {
+      display: block;
+      height: auto;
+      min-height: 300px;
+      position: absolute;
+      top: 0;
+      z-index: -1;
+    }
+
     .iframeSection {
       flex: 1 auto;
       height: 100%;
@@ -100,6 +110,7 @@
   justify-content: space-between;
   padding: 20px 20px 34px;
   border-top: 1px solid #f2f2f2;
+  background-color: #fff;
 
   .item {
     margin-right: 20px;

src/views/hot-music-more/music-detail/index.tsx

@@ -64,7 +64,6 @@ export default defineComponent({
         item.value = props.item;
         data.musicPdfUrl = ''
         data.iframeSrc = ''
-        console.log(props.item, 'item')
         __init();
       }
     );
@@ -156,6 +155,7 @@ export default defineComponent({
             const waterCanvasImg = await addWatermark(canvas);
             // canvas转图片
             const dataURL = await convasToImg(waterCanvasImg);
+            console.log(dataURL, 'dataUrl')
             setTimeout(() => {
               showToast('已保存到相册');
             }, 500);
@@ -603,11 +603,11 @@ export default defineComponent({
             )}
           </div>
 
-
-          <div class={styles.container} ref={downRef} style={{
-              display: 'block',
-              height: 'auto',
-            }}>
+          
+          
+        </div>
+        
+        <div class={[styles.container, styles.downContainer]}  ref={downRef}>
             <div
               class={[styles['right-musicName'], styles.downloadMusicName]}
               style={{
@@ -667,7 +667,6 @@ export default defineComponent({
                 )}
               </div>
           </div>
-        </div>
         <div class={styles.btnGroup}>
           <div class={styles.operation}>
             {isEnsemble.value && (