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);
相关推荐
星辰引路-Lefan6 小时前
深入理解React Hooks的原理与实践
前端·javascript·react.js
飞鸟malred7 小时前
vite+tailwind封装组件库
前端·react.js·npm
TE-茶叶蛋7 小时前
Vue Fragment vs React Fragment
javascript·vue.js·react.js
xd0000211 小时前
12.vite,webpack构建工具
react.js
在人间耕耘11 小时前
鸿蒙应用开发:WebSocket 使用示例
typescript
在人间耕耘11 小时前
uni-app/uniappx 中调用鸿蒙原生扫码能力的实践
typescript
WildBlue11 小时前
🚀 React初体验:从“秃头程序员”到“数据魔法师”的奇幻漂流
前端·react.js
哼唧唧_12 小时前
使用 React Native 开发鸿蒙(HarmonyOS)运动健康类应用的系统化准备工作
react native·react.js·harmonyos·harmony os5·运动健康
_一两风13 小时前
React 组件化开发:从项目创建到组件通信
react.js
工呈士13 小时前
Context API 应用与局限性
前端·react.js·面试