Skip to main content
GitHub

Source

useDataChannel

The useDataChannel hook returns the ability to send and receive messages. Pass an optional topic to narrow down which messages are returned in the messages array.

Import

import { useDataChannel } from "@livekit/components-react";

Remarks

There is only one data channel. Passing a topic does not open a new data channel. It is only used to filter out messages with no or a different topic.

Usage

Example 1

// Send messages to all participants via the 'chat' topic.
const { message: latestMessage, send } = useDataChannel("chat", (msg) =>
console.log("message received", msg)
);

Example 2

// Receive all messages (no topic filtering)
const { message: latestMessage, send } = useDataChannel((msg) =>
console.log("message received", msg)
);

Properties

topicTRequired
onMessage(msg: ReceivedDataMessage<T>) => voidOptional

Returns

UseDataChannelReturnType<T>;