feat: 排箫指法优化

src/page-instrument/view-figner/index.tsx

@@ -92,6 +92,7 @@ export default defineComponent({
       fingeringMode: query.type || ("scaleMode" as "fingeringMode" | "listenMode" | "scaleMode"), // 模式
       noteType: "all" as "#c" | "all", // 音调
       loadingDom: false, // 切换乐器时需要重置
+      loadingImg: false, // 切换模式，加载图片
     });
     const fingerData = reactive({
       relationshipIndex: 0,
@@ -213,6 +214,7 @@ export default defineComponent({
     // 切换当前模式
     const onChangeFingeringModel = () => {
       //
+      data.loadingImg = true
       if (playAction.listenLock) return;
       if (playAction.showAnswerLoading) return;
       if (data.fingeringMode === "scaleMode") {
@@ -276,6 +278,7 @@ export default defineComponent({
       }
 
       data.loadingDom = false;
+      data.loadingImg = false;
     };
 
     // 获取声部
@@ -995,7 +998,9 @@ export default defineComponent({
                   class={[styles.fingeringContainer]}
                 >
                   <div class={styles.imgs}>
-                    <img src={data.fingeringMode === "scaleMode" ? fingerData.subject?.json?.full : fingerData.subject?.json?.full1} />
+                    {
+                      !data.loadingImg && <img src={data.fingeringMode === "scaleMode" ? fingerData.subject?.json?.full : fingerData.subject?.json?.full1} />
+                    }
                     {rs.map((key: number | string, index: number) => {
                       const nk: string = typeof key === "string" ? key.replace("active-", "") : String(key);
                       return <img data-index={nk} src={fingerData.subject?.json?.[nk]} />;