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);
相关推荐
Java后端的Ai之路2 小时前
06-React-Props
前端·react.js·前端框架
雨雨雨雨雨别下啦10 小时前
【OpenHarmony北向开发】ArkTS基础教学
typescript·arkts·openharmonys
ZoeLandia13 小时前
TypeScript 01:类型注解与类型推断
前端·javascript·typescript
ZoeLandia13 小时前
TypeScript 02:interface、type 与类型收窄
前端·typescript
Java后端的Ai之路13 小时前
07React_Props验证器
人工智能·python·react.js·架构·fastapi
Aolith14 小时前
从收藏到错题本,我在 React 全栈项目里实现了一套复习系统
mongodb·react.js·全栈
行者-全栈开发15 小时前
华为云码道 CodeArts 实测:让 AI 用纯 TypeScript 写一个确定性回放的塔防小游戏「熵减特勤局」
typescript·小游戏·canvas·ecs·ai 编程·华为云码道·codearts 代码智能体
一木 之林16 小时前
Agent智能体学习总结:从一次调用到模型自主规划、工具调用与 ReAct 循环的项目实战-6/6
前端·人工智能·学习·react.js
mbshqqb1 天前
TypeScript基础教程之同步生成器
前端·javascript·typescript
song5011 天前
React Native for OpenHarmony 实战:三方库 react-native-parallax-scroll-view 的鸿蒙化适配指南
分布式·react native·react.js·transformer·harmonyos