feat: 新增开关音效

Haoyue-zhi · May 16, 2024 · 43c6b8d · 43c6b8d
1 parent 188b471
commit 43c6b8d
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/components/widget/themeSwitch.vue b/components/widget/themeSwitch.vue
@@ -1,4 +1,11 @@
 <script setup lang="ts">
+// @ts-ignore
+import { useSound } from "@vueuse/sound";
+import lightOn from "public/sounds/light-on.mp3";
+import lightOff from "public/sounds/light-off.mp3";
+const { play: playLight } = useSound(lightOn, { volume: 0.5 });
+const { play: playDark } = useSound(lightOff, { volume: 0.5 });
+
 const isDark = useDark({
   attribute: "data-theme",
 });
@@ -23,9 +30,9 @@ const switchTheme = (event: MouseEvent) => {
   // @ts-expect-error: Transition API
   const transition = document.startViewTransition(() => {
     toggleDark();
-    console.log(darkMode.value, isDark.value);
   });
   transition.ready.then(() => {
+    isDark.value ? playDark() : playLight();
     const clipPath = [
       `circle(0px at ${x}px ${y}px)`,
       `circle(${endRadius}px at ${x}px ${y}px)`,