Skip to content

useDisplayMedia ​

browser
test coverage
Last changed: 24 days ago

TIP

This hook uses mediaDevices.getDisplayMedia browser api to provide enhanced functionality. Make sure to check for compatibility with different browsers when using this api

Hook that provides screen sharing functionality

typescript
import { useDisplayMedia } from '@siberiacancode/reactuse';

Usage ​

typescript
const { stream, sharing, start, stop } = useDisplayMedia(ref);
// or
const { ref, stream, sharing, start, stop } = useDisplayMedia<HTMLVideoElement>();

Demo ​

Api ​

Parameters

NameTypeDefaultNote
targetHookTarget-The target video element to display the media stream
options.audio?boolean | MediaTrackConstraints-Whether to enable audio sharing
options.immediately?booleanfalseWhether to start immediately
options.video?boolean | MediaTrackConstraints-Whether to enable video sharing

Parameters

NameTypeDefaultNote
options.audio?boolean | MediaTrackConstraints-Whether to enable audio sharing
options.immediately?booleanfalseWhether to start immediately
options.video?boolean | MediaTrackConstraints-Whether to enable video sharing

Source ​

Source • Demo

Contributors ​

Avatardebabin

Released under the MIT License.