React Native - 包装在本机模块中创建的本机对象

Question

我有兴趣将一些 C++ 库包装为 react-native 模块，但我遇到了一些概念上的障碍。对这些东西很陌生，所以请多多包涵！

我想包装类似 Juce 的 AudioProcessorGraph 功能的东西 https://juce.com/doc/classAudioProcessorGraph_1_1AudioGraphIOProcessor

然而，api 的一个重要组成部分是将音频节点对象相互连接以形成音频处理图。你可以想象一些与网络音频非常相似的东西 api:

const audioCtx = new AudioContext();
const oscillator = new OscillatorNode(audioCtx);
const gainNode = new GainNode(audioCtx);

oscillator.connect(gainNode).connect(audioCtx.destination);

我看到的问题是，在我什至还没有写一行代码之前，我没有看到使用 RCT_EXPORT_METHOD 宏将本机对象的实例作为参数传递的方法到另一个本机对象的方法调用。 https://nodejs.org/api/addons.html#addons_wrapping_c_objects 我已经使用 ObjectWrap 功能对本机节点插件做了类似的事情。有没有办法用 react-native 完成类似的事情？

Answer 1

RCT_EXPORT_METHOD用于在IOS中导出一个函数到JS端。这里需要注意的是，你通过 JS 传递给 Native 或从 Native 传递给 JS 的参数应该是可序列化的。这是因为通信以异步方式通过 RN Bridge 发生。

这就是我在你的情况下会做的。让我们举个例子：

假设您在本机模块中有一个函数

//Initialise a list to store audioContexts
ArrayList<AudioContext> audioCtxList = new ArrayList<AudioContext>();

@ReactMethod
public void createAudioContext(Callback cb){
AudioContext audioCtx = new AudioContext();
audioCtxList.add(audioCtx);
cb.invoke(//...index of the newly created audioCtx)
}

现在在 JS 端你有一个可以用来与本机模块对话的引用

所以下一个函数看起来像

@ReactMethod
public void createOscillator(int audioCtxId){
 AudioCtx actx = // Get the audioContext from the list using the audioCtxId
 const oscillator = new OscillatorNode(audioCtx);
 const gainNode = new GainNode(audioCtx);
 oscillator.connect(gainNode).connect(audioCtx.destination);
}

因此，您不需要将任何本机对象导出到 JS 端，您也可以完成您需要的功能。

React Native - 包装在本机模块中创建的本机对象

React Native - Wrapping native objects created in native modules

react-native

native-module

react-native-native-module