嗨，我是 React 的新用戶，我正在嘗試將以下組件添加到我正在開發的應用程式中：
import React, { useState, useEffect, Component } from 'react';
import { StyleSheet, Text, View, TouchableOpacity } from 'react-native';
import { Camera, CameraType } from 'expo-camera';
function InAppCamera() {
const [hasPermission, setHasPermission] = useState(null);
const [type, setType] = useState(CameraType.back);
useEffect(() => {
(async () => {
const { status } = await Camera.requestCameraPermissionsAsync();
setHasPermission(status === 'granted');
})();
}, []);
if (hasPermission === null) {
return <View />;
}
if (hasPermission === false) {
return <Text>No access to camera</Text>;
}
return (
<View style={styles.container}>
<Camera style={styles.camera} type={type}>
<View style={styles.buttonContainer}>
<TouchableOpacity
style={styles.button}
onPress={() => {
setType(type === CameraType.back ? CameraType.front : CameraType.back);
}}>
<Text style={styles.text}> Flip </Text>
</TouchableOpacity>
</View>
</Camera>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
},
camera: {
flex: 1,
},
buttonContainer: {
flex: 1,
backgroundColor: 'transparent',
flexDirection: 'row',
margin: 20,
},
button: {
flex: 0.1,
alignSelf: 'flex-end',
alignItems: 'center',
},
text: {
fontSize: 18,
color: 'white',
},
});
export default InAppCamera;
我正在嘗試在另一個 .js 檔案中參考此組件，如下所示：
<FAB style={styles.fab} small icon="camera" onPress={InAppCamera} />
我收到無效掛鉤呼叫的錯誤。任何建議都會非常感謝您！
uj5u.com熱心網友回復：
//You can get some idea from the given sample.
const [showCamera, setCamera] = useState(false);
return <View>
/*Other Code If any */
<FAB style={styles.fab} small icon="camera" onPress={() => setCamera(!showCamera)} />
{showCamera ? <InAppCamera /> : null}
/*Other Code If any */
</View>
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/497193.html