Please provide the following:
- SDK Version: ~36.0.0
- Platforms(Android/iOS/web/all): all
Hi all. I’m trying to implement BarCodeScanner with functional component approach, but I keep getting this error:
Uncaught (in promise) TypeError: _ExpoBarCodeScannerModule__WEBPACK_IMPORTED_MODULE_15__.default.requestPermissionsAsync is not a function
The result is:
- on Web: it just shows “Requesting for camera permission”
- on iOS and Android: it ignores the component completely
Here’s the code:
import React, { useState, useEffect, FunctionComponent } from 'react';
import { Text, View, StyleSheet, Button } from 'react-native';
import { BarCodeScanner } from 'expo-barcode-scanner';
export const QRScanner:FunctionComponent = () => {
const [hasPermission, setHasPermission] = useState(null);
const [scanned, setScanned] = useState(false);
useEffect(() => {
(async () => {
const { status } = await BarCodeScanner.requestPermissionsAsync();
setHasPermission(status === 'granted');
})();
}, []);
const handleBarCodeScanned = ({ type, data }) => {
setScanned(true);
alert(`Bar code with type ${type} and data ${data} has been scanned!`);
};
if (hasPermission === null) {
return <Text>Requesting for camera permission</Text>;
}
if (hasPermission === false) {
return <Text>No access to camera</Text>;
}
return (
<View
style={{
flex: 1,
flexDirection: 'column',
justifyContent: 'flex-end',
}}>
<BarCodeScanner
onBarCodeScanned={scanned ? undefined : handleBarCodeScanned}
style={StyleSheet.absoluteFillObject}
/>
{scanned && <Button title={'Tap to Scan Again'} onPress={() => setScanned(false)} />}
</View>
);
}
I’m a newbie with Expo and React Native, and I’ve been staring at this the whole day. Please haaaalp!