防止极低概率的id/key重复

src/features/mark/MarkDrawTrack.vue

@@ -1,16 +1,16 @@
 <template>
   <transition-group name="track-score" tag="div">
-    <template v-for="(track, index) in trackList" :key="index">
+    <template v-for="(track, index) in trackList">
       <div
         v-if="store.shouldShowTrack"
         class="score-container"
         :class="[focusedTrack(track) && 'score-animation']"
         :style="computeTopAndLeft(track)"
-        :key="'key' + track.mainNumber + track.subNumber + track.offsetY"
+        :key="`key-${track.mainNumber}-${track.subNumber}-${track.offsetY}-${track.offsetX}`"
       >
         <span
           class="tw-m-auto"
-          :id="'a' + track.mainNumber + track.subNumber + track.offsetY"
+          :id="`a-${track.mainNumber}-${track.subNumber}-${track.offsetY}-${track.offsetX}`"
         >
           {{ track.score }}
         </span>
@@ -77,7 +77,7 @@ watch(
     if (topTrack) {
       document
         .querySelector(
-          `#a${topTrack.mainNumber + topTrack.subNumber + topTrack.offsetY}`
+          `#a-${topTrack.mainNumber}-${topTrack.subNumber}-${topTrack.offsetY}-${topTrack.offsetX}`
         )
         ?.scrollIntoView({ behavior: "smooth" });
     }

src/features/student/inspect/MarkDrawTrack.vue

@@ -7,7 +7,7 @@
     >
       <span
         class="tw-m-auto"
-        :id="'a' + track.mainNumber + track.subNumber + track.offsetY"
+        :id="`a-${track.mainNumber}-${track.subNumber}-${track.offsetY}-${track.offsetX}`"
       >
         {{ track.score }}
       </span>
@@ -66,7 +66,7 @@ watch(
     if (topTrack) {
       document
         .querySelector(
-          `#a${topTrack.mainNumber + topTrack.subNumber + topTrack.offsetY}`
+          `#a-${topTrack.mainNumber}-${topTrack.subNumber}-${topTrack.offsetY}-${topTrack.offsetX}`
         )
         ?.scrollIntoView({ behavior: "smooth" });
     }