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);
相关推荐
LaughingZhu5 分钟前
Product Hunt 每日热榜 | 2026-07-15
前端·人工智能·神经网络·react.js·搜索引擎·前端框架
光影少年1 小时前
RN中的StyleSheet.create 好处、内联样式弊端
react native·react.js·掘金·金石计划
我是大卫1 小时前
【图】React源码解析-第六部分:高级算法与执行链路
react.js·源码
小粉粉hhh15 小时前
React(二)——dom、组件间通信、useEffect
前端·javascript·react.js
索西引擎17 小时前
【React】key 属性:协调算法中的元素标识机制与最佳实践
前端·javascript·react.js
不好听61319 小时前
前端路由完全指南(上篇):从原理到 6 种路由模式
前端·react.js
不好听61319 小时前
前端路由完全指南(中篇):React Router Hooks 完全指南
前端·react.js
ndsc_d1 天前
前端实战复盘:用AI直接生成响应式官网落地页与React源码
前端·人工智能·react.js·ui·前端框架·aigc·paico
@@@@@@@@541 天前
JavaScript 的缺点与 TypeScript 的弥补
开发语言·javascript·typescript
用户0934077735141 天前
HarmonyOS WPS Open SDK 实践:最小打开闭环与 enableEdit 分支处理
typescript·harmonyos