【发布时间】:2020-08-21 00:24:22
【问题描述】:
我正在尝试让 expo 相机录制视频。但是,我收到一个错误:
[TypeError: camera.recordAsync is not a function. (In ‘camera.recordAsync()’, ‘camera.recordAsync’ is undefined)]
这是实现:
<Camera
style={{ flex: 1 }}
type={type}
ref={camera}
>
<View
style={{
flex: 1,
backgroundColor: 'transparent',
flexDirection: 'row',
}}>
<View style={{ alignSelf: 'flex-end', alignItems: 'center', padding: 20, flexDirection: 'row', justifyContent: 'space-between', width: '100%'}}>
<MaterialIcons name="video-library" onPress={pickVideo} color={"#eee"} size={45}/>
<RecordingIcon />
<Ionicons name="ios-reverse-camera" onPress={setCameraType} color={"#eee"} size={45}/>
</View>
</View>
</Camera>
重要的一行是 RecordingIcon。这表示可以按下来录制和停止录制的图标。
function RecordingIcon (){
if(recording){
stopRecording()
return (
<MaterialIcons name="fiber-manual-record" onPress={() => setRecording(false)} color={"#FF0000"} size={60}/>
)
} else {
record()
return (
<MaterialIcons name="fiber-manual-record" onPress={() => setRecording(true)} color={"#eee"} size={60}/>
)
}
}
每次我点击录制图标时,都会调用这两个函数之一。
async function record(){
console.log("record", camera);
if(camera){
let recording = await camera.recordAsync();
}
}
async function stopRecording(){
console.log("stop recording", camera);
if(camera){
let stopRecording = await camera.stopRecording();
}
}
但是,由于顶部的错误,这两个都不起作用:
async function record(){
console.log("record", camera);
if(camera){
let recording = await camera.recordAsync();
}
}
async function stopRecording(){
console.log("stop recording", camera);
if(camera){
let stopRecording = await camera.stopRecording();
}
}
这就是我初始化相机参考的方式。
let camera = useRef(null);
非常感谢任何人帮助解决此错误。我也试过做 camera.current.recordAsync() 和 camera.current.stopRecording(),但我得到了同样的错误。
【问题讨论】:
-
不确定这是否已解决,但您是否考虑过关于 ref 的相机组件,执行类似
{setCamera(ref);}}> 相机>
标签: reactjs react-native camera expo ref