TS-React:useRef 使用

不能给 useRef 的 current 属性赋值,提示一下错误信息:

Cannot assign to 'current' because it is a read-only property.(不能给current属性复制,因为它是一个只读属性。)

代码如下所示:

typescript 复制代码
let cameraMediaStream = useRef<MediaStream>(null);

/**
 * 打开摄像头
 **/
const openCamera = async (cameraId = curCameraId) => {
    try {
      // 关闭已打开的摄像头
      if (cameraMediaStream) await closeCamera();
      // Cannot assign to 'current' because it is a read-only property.
      cameraMediaStream.current = await ImageCapture.openCamera({ cameraId, video: videoRef.current, width, height });
    }
    catch (err: any) {
    	// 错误信息提示...
    }
}

解决方案:将 current 属性变为非只读属性,useRef 的泛型参数中增加【| null】即可把 current 属性变为非只读属性。

typescript 复制代码
let cameraMediaStream = useRef<MediaStream | null>(null);
相关推荐
RePeaT3 小时前
【Next.js】基础知识速查
前端·react.js·next.js
EaseUI3 小时前
【Ease UI】2026-04-16 组件更新:新增组件 xly-flow-designer 流程设计器 基于warm-flow二次开发
typescript·前端框架·流程设计器·组件库·warmflow
千寻girling4 小时前
被内推的面试 , 第一次
java·前端·python·面试·职场和发展·typescript·node.js
JustNow_Man5 小时前
Bun 常用命令速查清单(TypeScript 编译篇)
前端·javascript·typescript
|晴 天|5 小时前
从零打造现代化个人博客:Vue 3 + TypeScript + Element Plus 完整实战
javascript·css·chrome·typescript·html5·webstorm
大萝卜呼呼6 小时前
Next.js第十七课 - 部署
前端·typescript·next.js
M ? A7 小时前
Vue v-bind 转 React:VuReact 怎么处理?
前端·javascript·vue.js·经验分享·react.js·面试·vureact
军军君017 小时前
数字孪生监控大屏实战模板:政务服务大数据
前端·javascript·vue.js·typescript·前端框架·echarts·less
Ruihong9 小时前
你的 Vue KeepAlive 组件,VuReact 会编译成什么样的 React 代码?
vue.js·react.js·面试
Ruihong9 小时前
你的 Vue slot 插槽,VuReact 会编译成什么样的 React 代码?
vue.js·react.js·面试