React Native应用程序中的GS1条码扫描器阅读器

Question

我在我的react本机应用程序中使用了条形码扫描仪展览库，但无法扫描GS1型条形码，因此我在应用程序中使用了哪个库？

Answer 1

您是说应该使用哪个库？如果是这样，而您没有使用expo，那么https://github.com/react-native-community/react-native-camera这是相当不错且易于使用的依赖项，您可以用来满足您的目的。

Answer 2

class BarScannerView extends Component {

  constructor(props) {
    super(props);
    this.camera = null;
    this.barcodeCodes = [];

    this.state = {
      changeScreen: false,
      camera: {
        type: RNCamera.Constants.Type.back,
        flashMode: RNCamera.Constants.FlashMode.auto,
        barcodeFinderVisible: true
      }
    };
  }

  onBarCodeRead = (scanResult) => {
    if (scanResult.data !== null) {
      let bacodeScanResult = scanResult.data
      AsyncStorage.setItem('barcodeValue', bacodeScanResult)
      return this.props.navigation.navigate('Stock')
    }
    return;
  }

  componentDidMount() {
    console.log('componentDidMount', this.props)
    this.props.navigation.dismiss()
  }

  componentWillUnmount() {
    console.log('componentWillUnmount', this.props)
  }

  render() {
    return (
      <View style={styles.container}>
        <RNCamera
            ref={ref => {
              this.camera = ref;
            }}
            barcodeFinderVisible={this.state.camera.barcodeFinderVisible}
            barcodeFinderWidth={280}
            barcodeFinderHeight={220}
            barcodeFinderBorderColor="white"
            barcodeFinderBorderWidth={2}
            defaultTouchToFocus
            flashMode={this.state.camera.flashMode}
            onBarCodeRead={this.onBarCodeRead}
            onFocusChanged={() => {}}
            onZoomChanged={() => {}}
            permissionDialogTitle={'Permission to use camera'}
            permissionDialogMessage={'We need your permission to use your camera phone'}
            style={styles.preview}
            type={this.state.camera.type}
        />

        <View style={[styles.overlay, styles.topOverlay]}>
          <Text style={styles.scanScreenMessage}>Please scan the barcode.</Text>
        </View>

        <View style={{position: 'absolute', top: 150, left: '12%' }}>
          <View
            style={{
                width: 300,
                height: 300,
                backgroundColor: 'transparent',
                borderColor: 'white',
                borderWidth: 1
              }}
            >
          </View>
        </View>

        <View style={[styles.overlay, styles.bottomOverlay]}>
          <Button
            onPress={() => { console.log('scan clicked'); }}
            style={styles.enterBarcodeManualButton}
            title="Choose Barcode"
          />
        </View>
      </View>
    );
  }
}

您可以按照此操作。