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);
相关推荐
再希3 小时前
React+Tailwind CSS+Shadcn UI
前端·react.js·ui
浪裡遊6 小时前
Next.js路由系统
开发语言·前端·javascript·react.js·node.js·js
AAA不会前端开发8 小时前
TypeScript核心类型系统完全指南
前端·typescript
sen_shan8 小时前
Vue3+Vite+TypeScript+Element Plus开发-27.表格页码自定义
前端·javascript·typescript
刺客_Andy9 小时前
React 第五十二节 Router中 useResolvedPath使用详解和注意事项示例
前端·react.js·架构
烛阴10 小时前
为什么 `Promise.then` 总比 `setTimeout(..., 0)` 快?微任务的秘密
前端·javascript·typescript
XiaoSong10 小时前
基于 React Native/Expo 项目的持续集成(CI)最佳实践配置指南
前端·react native·react.js
前端老宋Running15 小时前
为什么react~Hooks只能在组件最顶层调用
前端·react.js·面试
Asort15 小时前
React类组件精要:定义机制与生命周期方法进阶教程
前端·javascript·react.js
WenGyyyL17 小时前
GMNER多模态实体识别任务——ReAct结合
前端·react.js·前端框架