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);
相关推荐
Zzj_tju2 小时前
Tool-Using LLM 论文精读路线:从 ReAct 到可验证工具调用
前端·react.js·前端框架
To_OC9 小时前
别再瞎写 React Router!7 个高频踩坑点一次性讲透
前端·javascript·react.js
kyriewen13 小时前
我踩了三次同一个坑才明白:React里"改了数据却不重新渲染"的真正原因
前端·javascript·react.js
A242073493014 小时前
React中请求拦截与响应拦截的统一处理方案
前端·javascript·react.js
烬羽15 小时前
《受控 vs 非受控:你以为用对了 useState,直到你写了那个表单》
javascript·react.js·前端框架
嘟嘟071715 小时前
React 受控组件与非受控组件:表单数据到底归谁管?
前端·javascript·react.js
水獭比特15 小时前
Agent 的 timeout 为什么会失效?把一条总预算传到底
人工智能·typescript
嘟嘟071715 小时前
React 表单管理进阶:从单字段到带校验的完整登录表单
前端·javascript·react.js
光影少年15 小时前
react navite原生事件监听、全局事件通知
前端·react native·react.js
烬羽15 小时前
《memo 明明加了,为什么子组件还是渲染了?》
react.js·性能优化·全栈