React Native 集成 iOS 原生功能(打印机功能为例)

#import <React/RCTBridgeModule.h>
#import <React/RCTEventEmitter.h>
@interface ZICOXPrinter : RCTEventEmitter <RCTBridgeModule>
@end

#import "ZICOXPrinter.h"
@implementation ZICOXPrinter
RCT_EXPORT_MODULE();
// 暴露方法给 JavaScript 调用
RCT_EXPORT_METHOD(print:(NSString *)text
                  resolver:(RCTPromiseResolveBlock)resolve
                  rejecter:(RCTPromiseRejectBlock)reject)
{
    // 打印功能实现
    @try {
        // 打印逻辑
        resolve(@YES);
    } @catch (NSException *exception) {
        reject(@"PRINT_ERROR", exception.reason, nil);
    }
}
// 如果需要支持事件发送，需要实现以下方法
- (NSArray<NSString *> *)supportedEvents
{
    return @[@"onPrintProgress", @"onPrintComplete"];
}
@end

import Foundation
@objc(ZICOXPrinter)
class ZICOXPrinter: RCTEventEmitter {
    @objc
    override static func moduleName() -> String! {
        return "ZICOXPrint"
    }
    @objc
    override func supportedEvents() -> [String]! {
        return ["onPrintProgress", "onPrintComplete"]
    }
    @objc
    func print(_ text: String,
               resolver resolve: @escaping RCTPromiseResolveBlock,
               rejecter reject: @escaping RCTPromiseRejectBlock) {
        do {
            // 打印逻辑实现
            resolve(true)
        } catch {
            reject("PRINT_ERROR", error.localizedDescription, error)
        }
    }
}

#import <React/RCTBridgeModule.h>
#import <React/RCTEventEmitter.h>

// 定义接口
interface ZICOXPrinterInterface {
  print(text: string): Promise<boolean>;
  connect(address: string): Promise<void>;
}
// 声明模块
declare module 'react-native' {
  interface NativeModulesStatic {
    ZICOXPrint: ZICOXPrinterInterface;
  }
}
// 创建包装器
import { NativeModules, NativeEventEmitter } from 'react-native';
const { ZICOXPrint } = NativeModules;
const eventEmitter = new NativeEventEmitter(ZICOXPrint);
export const ZICOXPrinter = {
  async print(text: string): Promise<boolean> {
    try {
      return await ZICOXPrint.print(text);
    } catch (error) {
      console.error('打印失败:', error);
      throw error;
    }
  },
  // 监听事件
  addPrintListener(callback: (progress: number) => void) {
    return eventEmitter.addListener('onPrintProgress', callback);
  }
};

import React, { useEffect } from 'react';
import { Button } from 'react-native';
import { ZICOXPrinter } from '../native/ZICOXPrinter';
export const PrintButton: React.FC = () => {
  useEffect(() => {
    const subscription = ZICOXPrinter.addPrintListener((progress) => {
      console.log('打印进度:', progress);
    });
    return () => subscription.remove();
  }, []);
  const handlePrint = async () => {
    try {
      const result = await ZICOXPrinter.print('要打印的内容');
      if (result) {
        console.log('打印成功');
      }
    } catch (error) {
      console.error('打印失败:', error);
    }
  };
  return <Button title="打印" onPress={handlePrint} />;
};