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);
相关推荐
xqslsm14 分钟前
TypeScript 联合类型深入解析
typescript
鱼毓屿御40 分钟前
从「只会聊」到「边想边做」的跃迁
前端·学习·react.js
嘟嘟07172 小时前
搞懂 useState 从原生 DOM 到 React 惰性初始化的完整链路
前端·react.js·编程语言
叫我少年2 小时前
TypeScript 基础类型
typescript
大爱编程♡5 小时前
Vue3+TypeScript+element-plus的文章管理项目(配后端接口)-退出及文章管理页面
前端·javascript·typescript
先吃饱再说5 小时前
React 组件设计:从 Props 传递到组件封装
前端·react.js
小月土星7 小时前
React 状态管理核心原理:从批量 DOM 到派生状态
react.js
烬羽9 小时前
AI 写代码总翻车?试试"先画图再砌墙"的 Vibe Coding 三步法
react.js·ai编程·vibecoding
如此风景9 小时前
TS装饰器详解
typescript
光影少年9 小时前
react navite 页面跳转、传参、路由监听、导航栏自定义
前端·react native·react.js