更新

src/views/information/famous-music-detail/index.module.less

@@ -90,6 +90,8 @@
   }
 
   .musicContent {
+    flex: 1;
+
     .musicTitle {
       max-width: 200px;
       overflow: hidden;
@@ -99,6 +101,14 @@
       font-weight: 600;
       color: #000000;
       line-height: 24px;
+
+      :global {
+        .van-notice-bar {
+          color: #000000;
+          padding: 0;
+          height: 24px;
+        }
+      }
     }
 
     .musicInto {

src/views/information/famous-music-detail/index.tsx

@@ -3,13 +3,14 @@ import MSticky from '@/components/m-sticky';
 import { defineComponent, onMounted, reactive } from 'vue';
 import { useEventListener, useWindowScroll } from '@vueuse/core';
 import styles from './index.module.less';
-import { Image } from 'vant';
+import { Image, NoticeBar } from 'vant';
 import request from '@/helpers/request';
 import { useRoute } from 'vue-router';
 import AudioPlayer from '../components/audio-player';
 import banner from '../images/banner1.png';
 import musicBg from '../images/music_bg.png';
 import MEmpty from '@/components/m-empty';
+import TheNoticeBar from '@/components/TheNoticeBar';
 
 export default defineComponent({
   name: 'instrument-detail',
@@ -18,7 +19,6 @@ export default defineComponent({
     const forms = reactive({
       titleOpacity: 0,
       background: 'transparent',
-      color: '#fff',
       detail: {} as any,
       musicList: [] as any,
       loading: false
@@ -80,7 +80,11 @@ export default defineComponent({
             </div>
             <div class={styles.musicContent}>
               <div class={[styles.musicTitle, 'van-multi-ellipsis--l2']}>
-                {forms.detail.name || '--'}
+                <NoticeBar
+                  scrollable={forms.detail.name >= 13 ? true : false}
+                  background="transparent"
+                  text={forms.detail.name || '--'}
+                />
               </div>
               <div class={styles.musicInto}>
                 {forms.detail.lyricists && (

src/views/knowledge-library/unit-detail.tsx

@@ -27,7 +27,7 @@ export default defineComponent({
       detailId: route.query.detailId,
       loading: false,
       background: 'transparent',
-      color: '#fff',
+      color: 'transparent',
       dataInfo: {} as any,
       title: ' ',
       listKnowledge: [] as any,
@@ -230,7 +230,7 @@ export default defineComponent({
           forms.color = '#323333';
         } else {
           forms.background = 'transparent';
-          forms.color = '#fff';
+          forms.color = 'transparent';
         }
       });