He implementado el siguiente gancho personalizado:
export default function useCamera() { const [cameraRatio, setCameraRatio] = useState(Camera.Constants.DesiredRatio); const [cameraType, setCameraType] = useState(Camera.Constants.Type.back); const [flashMode, setFlashMode] = useState( Camera.Constants.FlashMode.off ); const camRef = useRef(null); <----- Interesting part const cameraTypeRef = useRef(cameraType); const isTakingPhoto = useRef(false); const takePhoto = () => { if(!camRef.current) return; <----- Interesting part ... } const flip = () => {} const toggleFlash = () => {} ... return { camRef, cameraRatio, cameraType, flashMode, takePhoto, flip, toggleFlashMode, ... } }Entonces, en mi componente Cámara, solo hago:
function Camera({ ... }) { const { camRef, <---- Interesting part takePhoto, ... } = useCamera(); return <NativeCamera ref={camRef} onTakePhoto={takePhoto} ... /> }Como puede ver, estoy pasando camRef a "NativeCamera". Esta referencia se define en mi enlace personalizado "useCamera" y se recibe en mi componente "Cámara", que simplemente pasa la referencia al niño.
Pero esto no funciona. ¿Alguna solución?