title: TypeError: undefined is not an object (evaluating '_this.camera = _ref')
body: <p>-App dev in React Native-
  Hello,
  I have a problem with Expo Camera. Here an error is referred when you want to take a picture.</p>
  <p>&quot;TypeError: undefined is not an object (evaluating '_this.camera = _ref')&quot; / Scan.js.</p>
  <p>If the app is freshly updated with Expo, everything works. But as soon as you continue programming and another error occurs, this error appears and doesn't go away until you refresh the app again.</p>
  <p>I have tried a lot, but I need help here.</p>
  <p>Scan.js</p>
  <pre><code>import React, { Component, useState, useEffect } from 'react';
  import { View, Text, StyleSheet, TouchableOpacity, Image } from 'react-native';
  import {launchCamera, launchImageLibrary} from 'react-native-image-picker';
  import {Camera, Constants} from 'expo-camera';
  import * as MediaLibrary from 'expo-media-library';
  import * as Haptics from 'expo-haptics';
  
  
  import Images from '../assets/icon/index'
  
  
  
  const Scan = () =&gt; {
    const [hasPermission, setHasPermission] = useState(null);
    const [type, setType] = useState(Camera.Constants.Type.back);
    const [status, requestPermission] = MediaLibrary.usePermissions();
    
  
  
    useEffect(() =&gt; {
      (async () =&gt; {
        const { status } = await Camera.requestCameraPermissionsAsync();
        setHasPermission(status === 'granted');
      })();
    }, []);
  
    if (hasPermission === null) {
      return &lt;View/&gt;;
    }
    if (hasPermission === false) {
      return &lt;Text&gt;No access to camera&lt;/Text&gt;;
    }
    
    takePicture = async () =&gt; {
      if (this.camera) {
        let photo = await this.camera.takePictureAsync();
  
        Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Medium);
  
        console.log(photo.uri);
        MediaLibrary.saveToLibraryAsync(photo.uri);
      }
    };
  
    
    
    
    
  
    
    return (
      &lt;View style={styles.container}&gt;
        &lt;Camera style={styles.camera}
          type={type}
          ref={ref =&gt; {
            this.camera = ref;
          }}&gt;
          &lt;View style={styles.buttonContainer}&gt;
            &lt;TouchableOpacity
              style={styles.button}
              onPress={() =&gt; {
                setType(
                  type === Camera.Constants.Type.back
                    ? Camera.Constants.Type.front
                    : Camera.Constants.Type.back
                );
              }}
              &gt;
              &lt;Image source={Images.camera} style={styles.icon}&gt;&lt;/Image&gt;
            &lt;/TouchableOpacity&gt;
            &lt;TouchableOpacity
            style={styles.button}
            onPress={takePicture}
            &gt;
              &lt;Text style={styles.text}&gt;Take&lt;/Text&gt;
            &lt;/TouchableOpacity&gt;
          &lt;/View&gt;
        &lt;/Camera&gt;
      &lt;/View&gt;
    );
  }
  
  const styles = StyleSheet.create({
    container: {
      flex: 1,
    },
    camera: {
      flex: 1,
    },
    buttonContainer: {
      flex: 1,
      backgroundColor: 'transparent',
      flexDirection: 'row',
      margin: 20,
      top: 0,
    },
    button: {
      flex: 0.1,
      alignSelf: 'flex-end',
      alignItems: 'center',
    },
    text: {
      fontSize: 18,
      color: 'white',
    },
    icon : {
      tintColor: 'white',
    },
  })
  
  export default Scan; ```
  </code></pre>