Broadcast Channel

Reactive Broadcast Channel.

Usage

<script>
    import {broadcastChannel} from "@sveu/browser"
    
    const { supported, channel, data, post, close, error, closed } = broadcastChannel()
</script>
<script>
    import {broadcastChannel} from "@sveu/browser"
    
    const { supported, channel, data, post, close, error, closed } = broadcastChannel()
</script>
svelte

Example

Open new Tab, and start a broadcast :)

<script>
    import { broadcastChannel } from "@sveu/browser" 

    let value = "HI"

    const { data, post, error } = broadcastChannel() 

    $: if ($data) alert($data)

    $: if ($error) console.log($error)
</script>

<h1>Open new Tab, and start a broadcast :)</h1>

<input type="text" bind:value="{value}" />

<button on:click="{() => post(value)}">Post</button>
<script>
    import { broadcastChannel } from "@sveu/browser" 

    let value = "HI"

    const { data, post, error } = broadcastChannel() 

    $: if ($data) alert($data)

    $: if ($error) console.log($error)
</script>

<h1>Open new Tab, and start a broadcast :)</h1>

<input type="text" bind:value="{value}" />

<button on:click="{() => post(value)}">Post</button>
svelte
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
Click fold/expand code

API

Options

Name Description Type Default
name The name of the broadcast channel string default


Returns

Name Description Type
supported Is the BroadcastChannel supported. Readable<boolean>
channel The BroadcastChannel instance. Readable<BroadcastChannel>
data The data from the channel. Readable<unknown>
post Send data to the channel. (data: unknown) => void
close Close the channel. () => void
error The error from the channel. Readable<Event>
closed Is the channel closed. Readable<boolean>