在到目前為止我們看過的所有範例中，<script> 區塊包含每個元件實例初始化時執行的程式碼。對於絕大多數的元件，這就是您所需要的一切。
偶爾，您需要在個別元件實例之外執行一些程式碼。例如：回到先前的練習中的自訂音訊播放器，您可以同時播放所有四個音軌。如果播放一個音軌時停止所有其他音軌，那會更好。
我們可以透過宣告 <script module> 區塊來做到這一點。其中包含的程式碼將在模組首次評估時執行一次，而不是在實例化元件時執行。將此放置在 AudioPlayer.svelte 的頂部（請注意，這是一個獨立的腳本標籤）
音訊播放器
<script module>
let current;
</script>現在，元件可以相互「交談」，而無需任何狀態管理
音訊播放器
<audio
src={src}
bind:currentTime={time}
bind:duration
bind:paused
onplay={(e) => {
const audio = e.currentTarget;
if (audio !== current) {
current?.pause();
current = audio;
}
}}
onended={() => {
time = 0;
}}
/>上一頁 下一頁
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<script>
import AudioPlayer from './AudioPlayer.svelte';
import { tracks } from './tracks.js';</script>
<div class="centered">
{#each tracks as track} <AudioPlayer {...track} /> {/each}</div>
<style>
.centered {display: flex;
flex-direction: column;
height: 100%;
justify-content: center;
gap: 0.5em;
max-width: 40em;
margin: 0 auto;
}
</style>