useDevicesList

反应式 enumerateDevices 列出可用的输入/输出设备。

¥Reactive enumerateDevices listing available input/output devices.

示例

源代码演练场

Camera (0)

Microphones (0)

Speakers (0)

用法

¥Usage

import { useDevicesList } from '@vueuse/core'

const {
  devices,
  videoInputs: cameras,
  audioInputs: microphones,
  audioOutputs: speakers,
} = useDevicesList()

请求权限

¥Requesting Permissions

要请求权限，请使用 ensurePermissions 方法。

¥To request permissions, use the ensurePermissions method.

const {
  ensurePermissions,
  permissionGranted,
} = useDevicesList()

await ensurePermissions()
console.log(permissionsGranted.value)

组件

¥Component

<template>
  <UseDevicesList v-slot="{ videoInputs, audioInputs, audioOutputs }">
    Cameras: {{ videoInputs }}
    Microphones: {{ audioInputs }}
    Speakers: {{ audioOutputs }}
  </UseDevicesList>
</template>