Back to Vueuse

useDisplayMedia

packages/core/useDisplayMedia/index.md

14.3.0551 B
Original Source

useDisplayMedia

Reactive mediaDevices.getDisplayMedia streaming.

Usage

vue
<script setup lang="ts">
import { useDisplayMedia } from '@vueuse/core'
import { useTemplateRef } from 'vue'

const { stream, start } = useDisplayMedia()

// start streaming
start()

const videoRef = useTemplateRef('video')
watchEffect(() => {
  // preview on a video element
  videoRef.value.srcObject = stream.value
})
</script>

<template>
  <video ref="video" />
</template>