推荐使用：React Native的card.io组件

React Native的card.io组件是一个用于扫描信用卡和ID等的库。以下是如何使用它的示例代码：

首先，你需要安装card.io库，可以通过npm或yarn进行安装：

npm install card-io-react-native --save
# 或者
yarn add card-io-react-native

然后，你需要链接原生的card.io库，这可以通过以下命令来完成：

react-native link card-io

最后，你可以在你的React Native代码中使用CardIO组件来扫描信用卡，如下所示：

import React, { Component } from 'react';
import {
  StyleSheet,
  View,
  Text,
  TouchableOpacity
} from 'react-native';
import CardIO from 'card-io-react-native';
 
export default class CardIOExample extends Component {
  constructor(props) {
    super(props);
    this.state = {
      scannedCardDetails: ''
    };
  }
 
  scanCard = () => {
    let cardIORequest = {
      // 自定义card.io的请求参数，如需要
    };
 
    CardIO.scanCardIO(cardIORequest).then((scannedCard) => {
      this.setState({ scannedCardDetails: scannedCard.cardNumber });
    }).catch(error => {
      // 处理错误，例如用户取消
      console.log('CardIOModule - Scan Error', error);
    });
  }
 
  render() {
    return (
      <View style={styles.container}>
        <TouchableOpacity onPress={this.scanCard} style={styles.button}>
          <Text style={styles.buttonText}>扫描信用卡</Text>
        </TouchableOpacity>
        <Text style={styles.scannedCard}>扫描结果: {this.state.scannedCardDetails}</Text>
      </View>
    );
  }
}
 
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  button: {
    backgroundColor: '#16a085',
    padding: 10,
    marginBottom: 10,
  },
  buttonText: {
    color: 'white',
    fontSize: 16,
  },
  scannedCard: {
    fontSize: 16,
  },
});

在这个例子中，我们创建了一个名为CardIOExample的React Native组件，它包含一个扫描信用卡的按钮和显示扫描结果的文本。当按钮被按下时，scanCard函数会被调用，它启动card.io扫描界面，完成扫描后，会将信用卡号码显示在屏幕上。