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
Name | Type | Default | Note |
---|---|---|---|
target | HookTarget | - | The target video element to display the media stream |
options.audio? | boolean | MediaTrackConstraints | - | Whether to enable audio sharing |
options.immediately? | boolean | false | Whether to start immediately |
options.video? | boolean | MediaTrackConstraints | - | Whether to enable video sharing |
Returns
Parameters
Name | Type | Default | Note |
---|---|---|---|
options.audio? | boolean | MediaTrackConstraints | - | Whether to enable audio sharing |
options.immediately? | boolean | false | Whether to start immediately |
options.video? | boolean | MediaTrackConstraints | - | Whether to enable video sharing |