import { type VNodeRef, watch } from 'vue'
|
|
/**
|
* 把响应式 MediaStream 挂到 `<video>` / `<audio>` 元素的 srcObject 上；
|
* stream 为空时清掉 srcObject，避免设备关闭后画面卡在最后一帧
|
*/
|
export function useMediaStreamElement<T extends HTMLMediaElement>(
|
streamSource: () => MediaStream | null | undefined
|
): VNodeRef {
|
let el: T | null = null
|
let currentStream: MediaStream | null | undefined
|
|
const syncStream = () => {
|
if (el) {
|
el.srcObject = currentStream || null
|
}
|
}
|
|
watch(
|
streamSource,
|
(stream) => {
|
currentStream = stream
|
syncStream()
|
},
|
{ flush: 'post', immediate: true }
|
)
|
|
return (value) => {
|
if (value instanceof HTMLMediaElement) {
|
el = value as T
|
syncStream()
|
return
|
}
|
|
if (el) {
|
el.srcObject = null
|
}
|
el = null
|
}
|
}
|
