react-native-printer
A React Native Library to support USB/BLE/Net printer for Android platform
Installation
npm install react-native-printer --save
Integrate module
To integrate react-native-printer
with the rest of your react app just execute:
react-native link react-native-printer
Usage
import { USBPrinter, NetPrinter, BLEPrinter } from 'react-native-printer'; USBPrinter.printText('<C>这是一个测试打印</C>') USBPrinter.printBill("<C>这是一段打印测试文字</C>")
Example
USBPrinter
Printer structure
{ device_name: '/usb/lp1', vendor_id: 1155, product_id: 22304, }
componentDidMount = () => { if(Platform.OS == 'android'){ USBPrinter.init().then(()=> { //list printers USBPrinter.getDeviceList() .then(printers => { this.setState(Object.assign({}, this.state, {printers: printers})) }); //connect printer vendorID = 1155 productId = 22304 USBPrinter.connectPrinter(vendorID, productId).then( (printer) => this.setState(Object.assign({}, this.state, {currentPrinter: printer})), error => console.warn(error)) }) } } printTextTest = () => { if(this.state.currentPrinter) { USBPrinter.printText("<C>这是一段打印测试文字</C> "); }else{ console.log("没有设置打印机") } } printBillTest = () => { if(this.state.currentPrinter) { USBPrinter.printBill("<C>这是一段打印测试文字</C>"); }else{ console.log("没有设置打印机") } } ... render() { return ( <View style={styles.container}> { this.state.printers.map(printer => ( <TouchableOpacity key={printer.device_id} onPress={(printer) => this._connectPrinter(printer.vendor_id, printer.product_id)}> {`device_name: ${printer.device_name}, device_id: ${printer.device_id}, vendor_id: ${printer.vendor_id}, product_id: ${printer.product_id}`} </TouchableOpacity> )) } <TouchableOpacity onPress={() => this.printTextTest()}> <Text> Print Text </Text> </TouchableOpacity> <TouchableOpacity onPress={() => this.printBillTest()}> <Text> Print Bill Text </Text> </TouchableOpacity> </View> ) } ...
BLEPrinter
Printer structure:
{ device_name: '内部打印机', inner_mac_address: 'XXXXX-XXXXXXXX', }
componentDidMount = () => { if(Platform.OS == 'android'){ USBPrinter.init().then(()=> { //list printers USBPrinter.getDeviceList() .then(printers => { this.setState(Object.assign({}, this.state, {printers: printers})) }); }) } } _connectPrinter => (inner_mac_address) => { if(Platform.OS == 'android'){ //connect printer USBPrinter.connectPrinter(inner_mac_address).then( (printer) => this.setState(Object.assign({}, this.state, {currentPrinter: printer})), error => console.warn(error)) } } printTextTest = () => { if(this.state.currentPrinter) { USBPrinter.printText("<C>这是一段打印测试文字</C> "); }else{ console.log("没有设置打印机") } } printBillTest = () => { if(this.state.currentPrinter) { USBPrinter.printBill("<C>这是一段打印测试文字</C>"); }else{ console.log("没有设置打印机") } } ... render() { return ( <View style={styles.container}> { this.state.printers.map(printer => ( <TouchableOpacity key={printer.inner_mac_address} onPress={(printer) => this._connectPrinter(printer.inner_mac_address)}> {`device_name: ${printer.device_name}, inner_mac_address: ${printer.inner_mac_address}`} </TouchableOpacity> )) } <TouchableOpacity onPress={() => this.printTextTest()}> <Text> Print Text </Text> </TouchableOpacity> <TouchableOpacity onPress={() => this.printBillTest()}> <Text> Print Bill Text </Text> </TouchableOpacity> </View> ) } ...
NetPrinter
Printer structure:
{ device_name: "192.168.10.241:9100", host: '192.168.10.241', port: 9100 }
componentDidMount = () => { if(Platform.OS == 'android'){ NetPrinter.init().then(() => { this.setState(Object.assign({}, this.state, {printers: [{host: '192.168.10.241', port: 9100}]})) }) } } _connectPrinter => (host, port) => { if(Platform.OS == 'android'){ //connect printer NetPrinter.connectPrinter(host, port).then( (printer) => this.setState(Object.assign({}, this.state, {currentPrinter: printer})), error => console.warn(error)) } } printTextTest = () => { if(this.state.currentPrinter) { NetPrinter.printText("<C>这是一段打印测试文字</C> "); }else{ console.log("没有设置打印机") } } printBillTest = () => { if(this.state.currentPrinter) { NetPrinter.printBill("<C>这是一段打印测试文字</C>"); }else{ console.log("没有设置打印机") } } ... render() { return ( <View style={styles.container}> { this.state.printers.map(printer => ( <TouchableOpacity key={printer.device_id} onPress={(printer) => this._connectPrinter(printer.host, printer.port)}> {`device_name: ${printer.device_name}, host: ${printer.host}, port: ${printer.port}`} </TouchableOpacity> )) } <TouchableOpacity onPress={() => this.printTextTest()}> <Text> Print Text </Text> </TouchableOpacity> <TouchableOpacity onPress={() => this.printBillTest()}> <Text> Print Bill Text </Text> </TouchableOpacity> </View> ) } ...
转载自 http://npm.taobao.org/package/react-native-printer