Soy bastante nuevo en React Native. Estoy construyendo una aplicación que necesita escanear un código de barras. Estoy pidiendo permisos, lo cual funciona. Después de que se haya otorgado el permiso, quiero abrir la cámara. Cada vez que hago clic en el botón, la aplicación no abre la cámara. Estoy bastante atascado ahora mismo. ¿Cómo puedo arreglar esto?

Gracias de antemano Rico

 import { StatusBar } from "expo-status-bar"; import { StyleSheet, Text, View, Button, TextInput, Image } from "react-native"; import { useEffect, useState } from "react"; import { BarCodeScanner } from "expo-barcode-scanner"; //import Camera from "./screens/Camera.js"; export default function ScanScreen() { const [hasPermission, setHasPermission] = useState(null); const [scanned, setScanned] = useState(false); const [text, setText] = useState("Not yet scanned"); useEffect(() => { askPermissions(); }, []); const askPermissions = () => { (async () => { console.log("Asking for permissions"); const { status } = await BarCodeScanner.requestPermissionsAsync(); setHasPermission(status == "granted"); openCamera(); })(); }; const handleBarCodeScanned = ({ type, data }) => { setScanned(true); alert(`Bar code with type ${type} and data ${data} has been scanned!`); }; function openCamera() { if (hasPermission === true) { console.log("Camera opened, permission true"); return ( <View> <BarCodeScanner onBarCodeScanned={scanned ? undefined : handleBarCodeScanned} style={{ height: 400, width: 400 }} /> </View> ); } } return ( <View style={{ flex: 1, flexDirection: "row", alignItems: "center", justifyContent: "center", }} > <View style={{ padding: 100, }} > <Image source={{ uri: "https://i.ibb.co/tmvt00w/logo.png", }} style={{ height: 300, width: 300, borderRadius: 1000 }} /> <TextInput placeholder="Enter barcode" style={{ borderBottomColor: "black", borderBottomWidth: 1, padding: 10, marginBottom: 10, }} /> <Button title="Open camera" onPress={() => askPermissions()} /> <StatusBar style="auto" /> </View> </View> ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff", alignItems: "center", justifyContent: "center", }, });