速度

src/page-colexiu/header-top/speed/index.tsx

@@ -11,6 +11,7 @@ export default defineComponent({
 	setup(props) {
 		const speed = reactive({
 			value: state.speed,
+			isUpdate: false,
 		});
 
 		const minusSpeed = () => {
@@ -21,13 +22,29 @@ export default defineComponent({
 			speed.value = Math.min(speed.value + 1, 270);
 		};
 
-		watch(() => speed.value, () => {
-			handleSetSpeed(speed.value)
-		})
+		watch(
+			() => speed.value,
+			() => {
+				// 更新状态, 不触发
+				if (speed.isUpdate) {
+					speed.isUpdate = false;
+					return;
+				}
+				handleSetSpeed(speed.value);
+			}
+		);
+
+		watch(
+			() => headData.speedShow,
+			() => {
+				speed.isUpdate = true;
+				speed.value = state.speed;
+			}
+		);
 
 		const speedRef = ref();
 		useClickAway(speedRef, () => {
-			headData.speedShow = false
+			headData.speedShow = false;
 		});
 
 		return () => (
@@ -41,5 +58,5 @@ export default defineComponent({
 				<Button class={styles.btn} icon={headImg("minus.png")} disabled={state.speed == 45} onClick={minusSpeed} />
 			</div>
 		);
-	}
+	},
 });

src/page-gym/header-top/speed/index.tsx

@@ -11,6 +11,7 @@ export default defineComponent({
 	setup(props) {
 		const speed = reactive({
 			value: state.speed,
+			isUpdate: false,
 		});
 
 		const minusSpeed = () => {
@@ -21,13 +22,29 @@ export default defineComponent({
 			speed.value = Math.min(speed.value + 1, 270);
 		};
 
-		watch(() => speed.value, () => {
-			handleSetSpeed(speed.value)
-		})
+		watch(
+			() => speed.value,
+			() => {
+				// 更新状态, 不触发
+				if (speed.isUpdate) {
+					speed.isUpdate = false;
+					return;
+				}
+				handleSetSpeed(speed.value);
+			}
+		);
+
+		watch(
+			() => headData.speedShow,
+			() => {
+				speed.isUpdate = true;
+				speed.value = state.speed;
+			}
+		);
 
 		const speedRef = ref();
 		useClickAway(speedRef, () => {
-			headData.speedShow = false
+			headData.speedShow = false;
 		});
 
 		return () => (
@@ -41,5 +58,5 @@ export default defineComponent({
 				<Button class={styles.btn} icon={headImg("minus.png")} disabled={state.speed == 45} onClick={minusSpeed} />
 			</div>
 		);
-	}
+	},
 });

src/page-orchestra/header-top/speed/index.tsx

@@ -11,6 +11,7 @@ export default defineComponent({
 	setup(props) {
 		const speed = reactive({
 			value: state.speed,
+			isUpdate: false,
 		});
 
 		const minusSpeed = () => {
@@ -23,16 +24,32 @@ export default defineComponent({
 
 		/** 还原速度 */
 		const resetMinus = () => {
-			speed.value = state.originSpeed
-		}
+			speed.value = state.originSpeed;
+		};
+
+		watch(
+			() => speed.value,
+			() => {
+				// 更新状态, 不触发
+				if (speed.isUpdate) {
+					speed.isUpdate = false;
+					return;
+				}
+				handleSetSpeed(speed.value);
+			}
+		);
 
-		watch(() => speed.value, () => {
-			handleSetSpeed(speed.value)
-		})
+		watch(
+			() => headData.speedShow,
+			() => {
+				speed.isUpdate = true;
+				speed.value = state.speed;
+			}
+		);
 
 		const speedRef = ref();
 		useClickAway(speedRef, () => {
-			headData.speedShow = false
+			headData.speedShow = false;
 		});
 
 		return () => (
@@ -47,5 +64,5 @@ export default defineComponent({
 				<Button class={styles.btn} icon={headImg("icon-resetMinus.svg")} onClick={resetMinus} />
 			</div>
 		);
-	}
+	},
 });