优化刷新动画

src/view/music-score/index.tsx

@@ -210,30 +210,31 @@ export default defineComponent({
 		});
 
 		/** 刷新曲谱 */
-		const refreshMusicScore = async () => {
-			console.log('刷新谱面123')
-			isLoadingCss.value = true
-			const container = document.getElementById('musicAndSelection'), svgDom = document.getElementById('osmdCanvasPage1'), selectionBox = document.getElementById('selectionBox'), selectionBgBox = document.getElementById('selectionBgBox');
-			if (container) {
-				svgDom && container?.removeChild(svgDom)
-				selectionBox && container?.removeChild(selectionBox)
-				selectionBgBox && container?.removeChild(selectionBgBox)
-			}
-			state.vfmeasures = [];
-			musicData.showSelection = false;
-			state.osmd.clear();
-			musicData.isRenderLoading = true;
-			musicData.isRefreshLoading = true;
-			// 在下一帧再执行，确保出现loading
-			requestAnimationFrame(async ()=>{
-				getContainerWidth();
-				//setRenderType();
-				await getXML();
-				await init();
-				musicData.isRenderLoading = false;
-				musicData.isRefreshLoading = false;
-				musicData.showSelection = true;
-				isLoadingCss.value = false
+		const refreshMusicScore = () => {
+			// 有可能会有 其他地方的js执行 阻塞 这里下一帧再执行确保加载条出来
+			requestAnimationFrame(() =>{
+				isLoadingCss.value = true
+				requestAnimationFrame(async () => {
+					const container = document.getElementById('musicAndSelection'), svgDom = document.getElementById('osmdCanvasPage1'), selectionBox = document.getElementById('selectionBox'), selectionBgBox = document.getElementById('selectionBgBox');
+					if (container) {
+						svgDom && container?.removeChild(svgDom)
+						selectionBox && container?.removeChild(selectionBox)
+						selectionBgBox && container?.removeChild(selectionBgBox)
+					}
+					state.vfmeasures = [];
+					musicData.showSelection = false;
+					state.osmd.clear();
+					musicData.isRenderLoading = true;
+					musicData.isRefreshLoading = true;
+					getContainerWidth();
+					//setRenderType();
+					await getXML();
+					await init();
+					musicData.isRenderLoading = false;
+					musicData.isRefreshLoading = false;
+					musicData.showSelection = true;
+					isLoadingCss.value = false
+				})
 			})
 		}
 		expose({