Actualmente estoy creando una aplicación de Windows con Tauri y Svelte, pero encontré un problema. Tengo un botón que, cuando se hace clic, abre el sistema de archivos para permitir que se seleccione un nuevo video. Cuando se selecciona un nuevo video, actualizo VideoStore con la nueva ruta. Todo esto funciona muy bien, y con el siguiente código, el video se actualiza para mostrar el nuevo video, sin embargo, también quiero restablecer el tiempo = 0 para que el nuevo video comience desde el principio, pero eso no está sucediendo aquí. Entonces, si el video anterior tenía 20 segundos cuando se selecciona un nuevo archivo, el nuevo video también comienza a los 20 segundos.

Al hacer clic en el botón Restablecer, el tiempo vuelve a cambiar a 0, pero me gustaría que también suceda automáticamente cuando VideoStore se actualice y se cargue el nuevo video.

Actualizo la hora cuando $VideoStore cambia y la hora está vinculada a la hora actual del video :

 $: { time = 0; video_src = `https://asset.localhost/${$VideoStore}`; }

El código completo:

Video.svelte

 <script> import VideoStore from "../stores/VideoStore"; let video_src = $VideoStore; let time = 0; let duration; let paused = true; const skip = () => { time += 10; }; function resetTime() { time = 0; } $: { time = 0; video_src = `https://asset.localhost/${$VideoStore}`; } </script> <p>{time}</p> <button on:click={resetTime}>Reset</button> <button on:click={skip}>Skip 10 seconds</button> <!-- svelte-ignore a11y-media-has-caption --> <div class="player"> {#key video_src} <video src={video_src} width="1280" height="720" bind:currentTime={time} bind:duration bind:paused controls > </video> {/key} </div>

OpenButton.svelte

 <script> import { open } from "@tauri-apps/api/dialog"; import { documentDir } from "@tauri-apps/api/path"; import VideoStore from "../stores/VideoStore"; let filename = ""; const openfile = async () => { const selected = await open({ directory: false, multiple: false, defaultPath: await documentDir(), }); filename = selected.replace(/\\/g, "/"); VideoStore.update(() => { return filename; }); }; </script> <button on:click={openfile}>Open File</button>