Интеграция компонента iOS в React Native

Да. Вы можете сделать и то, и другое

1.

https://facebook.github.io/react-native/docs/platform-specific-code.html

2.

https://codeburst.io/integrate-react-native-into-an-existing-app-ios-87c947a16044https://facebook.github.io/react-native/docs/integration-with-existing-apps.html

Можем ли мы добавить код iOS (быстрый или целевой C) в приложение React Native?

Да, мне удалось это сделать: -

1. Я создал проект React Native, скомпилировал его и запустил в симуляторе.
2. Перейдите в папку iOS в структуре каталогов в проекте и откройте .xcodeproj в xcode.
3. Создайте объектный файл c (MyObjcClass) и создайте функции, которые вы хотите использовать в React.

MyObjcClass.h

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

@interface MyObjcClass : NSObject <RCTBridgeModule>

@end

MyObjcClass.m

#import "MyObjcClass.h"

@implementation MyObjcClass

// tells react bridge to bridge our created class
RCT_EXPORT_MODULE()

- (NSDictionary *)constantsToExport {
  return @{@"CreatedBy": @"Type any number and get Square"};
}

RCT_EXPORT_METHOD(squareNumber:(int)number getCallback:(RCTResponseSenderBlock)callback) {
  callback(@[[NSNull null], [NSNumber numberWithInt:(number*number)]]);
}

Теперь мы можем вызывать эти методы в JS. Ниже я покажу, как вызвать цель c в React.

App.js

import React from 'react';
import { StyleSheet, Text, View, TextInput, Button } from 'react-native';

// to import native code
import {NativeModules} from 'react-native';

var MyObjcClass = NativeModules.MyObjcClass;

export default class App extends React.Component {

  state = {
    number:0
  };

  squareMe(num) {
    if (num == '') {
      return;
    }

    MyObjcClass.squareNumber(parseInt(num), (error, number) => {
      if (error) {
        console.error(error);
      } else {
        this.setState({number: number});
      }
    })
  }

  render() {

    return (
      <View style = {styles.container}>
        <Text style = {styles.spaceBetween}>Objective C inclusion</Text>
        <TextInput placeholder = "type a number ...." style = {styles.input} onChangeText = {(text) => this.squareMe(text)}/>
        <ListItem placeName = {this.state.number}></ListItem>
      </View>
      );
  }
}

да, мы можем сделать

import {Platform} from 'react-native';

const majorVersionIOS = parseInt(Platform.Version, 10);
if (majorVersionIOS <= 9) {
  console.info('Work around a change in behavior');
}