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);
相关推荐
ZoeLandia16 小时前
React6:组件通信
前端·react.js·typescript
孟陬19 小时前
解决动态 import 类型 Any 痼癖
typescript·node.js·bun
ZoeLandia20 小时前
React03:useState 与不可变更新
前端·react.js·typescript·react
鬼手点金20 小时前
单轮对话:最简单的 API 调用
java·服务器·前端·javascript·react.js·servlet·tomcat
console.log('npc')1 天前
从0到1实现任务评价统计功能:React + TypeScript 实战指南(小白注释版)
前端·react.js·typescript
ZoeLandia1 天前
React04:事件处理与受控表单
开发语言·前端·react.js·typescript
ZoeLandia1 天前
React05:useEffect 与副作用
开发语言·前端·react.js·typescript
濮水大叔2 天前
函数式与对象式:前端架构的两种成本曲线
vue.js·react.js·函数式编程
Flynt2 天前
Cloudflare 用 Rust 重写了 TypeScript:我拿同一批代码跑了跑,报错一模一样,退出码不一样
rust·typescript·前端工程化
落花看风雪2 天前
从零开始搭建后台系统(vue3+TypeScript+Vite)01
typescript·vue·js