Как нативные модули привязываются к react-ту в React-native?

Question

[Андрей]

Немного не уверен в своем понимании самой работы нативных модулей с использованием React. начально React-native предоставляет их в не плохом количестве с по возможности уже реализацией сразу на обеих (ios, android) платформах, например простой Text компонент используется для отображения текста сразу на обеих платформах, значит он запилен facebook разрабами для ios и android - соответственной реализацией на objective-c и java языками, а потом как то связали это с react-ом и js кодом, не понимаю как работает сам bridge и link к js с такими модулями ?

Answer 1

[Артем Васильев]

Они экспортируются в нативном коде, к примеру в java есть такой декоратор, который позволяет вызвать эту нативную функцию из JS потока:

// my method class
 @ReactMethod
    public void setCurrentTime(final Integer key, final Float sec) {
        MediaPlayer player = this.playerPool.get(key);
        if (player != null) {
            player.seekTo((int) Math.round(sec * 1000));
        }
    }

В Obj-C есть свое:

// создается нативный модуль OutputVolume
@implementation OutputVolume

RCT_EXPORT_MODULE();

// Отдает метод get
RCT_REMAP_METHOD(get,  
                 resolver:(RCTPromiseResolveBlock)resolve
                 rejecter:(RCTPromiseRejectBlock)reject)
{
  float volume = [AVAudioSession sharedInstance].outputVolume;
  NSString* volumeString = [NSString stringWithFormat:@"%f", volume];

  if (volumeString) {
    resolve(volumeString);
  } else {
    reject(@"get_error", @"Error getting system volume", nil);
  }

}

А вот как принимать это в JS коде:

import { NativeModules } from 'react-native';

const MyNativeModule = NativeModules.MyNativeModule;

Почитать:
- https://www.promptworks.com/blog/writing-native-mo...
- https://clever.ly/blog/2017/05/09/going-native-cre...
- https://shift.infinite.red/native-modules-for-reac...