TypeError:Cannot read property 'reactivate' of undefine

[monoharmayumrohitsharma]

return ( <QRCodeScanner ref={(node) => { this.scanner = node }} onRead={this.onSuccess} topContent={ <Text style={styles.centerText}> Go to <Text style={styles.textBold}>wikipedia.org/wiki/QR_code</Text> on your computer and scan the QR code. </Text> } bottomContent={ <TouchableOpacity onPress={this.scanner.reactivate.bind(this)} style={styles.buttonTouchable}> <Text style={styles.buttonText}>OK. Got it!</Text> </TouchableOpacity>

[monoharmayumrohitsharma]

please anyone help me with this reactivate method

[kanikas24]

#same issue reactivate not working

[SneiderSanchez]

Hi, can you please show me the code where you are calling the reactivate method?

even though, here are a simple example on how to reactivate the qr reader:

import React, { Component } from 'react';
import QRCodeScanner from 'react-native-qrcode-scanner';
import {Alert} from 'react-native';

export default class App extends Component {
  constructor(props) {
    super(props)
  }
  onSuccess = async (qrRes) => {
    //simple alert for reactivate the QRScaner
    Alert.alert(
      'Read!!',
      'When you press ok, i will reactivate the QRScanner :)',
      [                              
        { text: 'OK', onPress: () => this.scanner.reactivate() },
      ],
      { cancelable: false },
    );
    //Your stuff onSuccess reading 
  }
  render() {
    return (
    <QRCodeScanner
      onRead={this.onSuccess}
      ref={(node) => { this.scanner = node }}
      //Your props stuff ...
    />
    );
  }
};

[jstnl]

I also have this problem. Is there any update on a solution? I am currently using functional components and using the useRef hook and ref={scanner} in my component and I get the same issue.

[iluvpy]

it looks like you need to use es6 syntax to make this work: onSuccess = async (qrRes) => { // code here }

[azim-barcove]

For using in functional components, you'll declare like below:-

import React, { useRef } from 'react';
import QRCodeScanner from 'react-native-qrcode-scanner';

const myComponentScreen = () => {
  const scanner = useRef();

  const onSuccess = async (scanRes) => {
    if (scanRes.data == 'no') {
      scanner.current.reactivate();
    }
  };

  return (
    <QRCodeScanner
      onRead={onSuccess}
      flashMode={RNCamera.Constants.FlashMode.off}
      showMarker={true}
      ref={scanner}
    />
  )
};