¿Hay alguna guía para implementar JavaScriptModule en react-native?
Interesados en implementar llamadas nativas a llamadas javascript en react-native. Pero no encontró guías para eso.
Por favor, ayuda con algunos ejemplos de creación y registro de nativos a los módulos javascript en reaccionar nativo.
- ¿Es posible crear un widget de escritorio con react-native?
- React Native - Error al llamar AppRegistry.runApplication
- En una aplicación React Native JavaScript, ¿por qué cambiaría el comportamiento de Android GC si creaba una variable temporal en lugar de devolver un valor directamente?
- TypeError: undefined no es una función (evaluando 'remoteModules.forEach')
- Cómo tocar y mantener presionado para seleccionar texto en React Native
Ya se ha descubierto que el código de los módulos nativos oficiales de la documentación android tiene un método llamado createJSModules , que devuelve una lista de clases JavaScriptModule .
class AnExampleReactPackage implements ReactPackage { @Override public List<Class<? extends JavaScriptModule>> createJSModules() { return Collections.emptyList(); } ... }
Javadoc para com.facebook.react.bridge.JavaScriptModule dice:
/** * Interface denoting that a class is the interface to a module with the same name in JS. Calling * functions on this interface will result in corresponding methods in JS being called. * ... */ @DoNotStrip public interface JavaScriptModule { }
Fui capaz de crear interfaz y pasar su clase a createJSModules pero no tienen idea de cómo registrar el módulo javascript adecuado de código js.
- Utilizando RxJava para la validación de inicio de sesión de correo electrónico, un observable está emitiendo dos veces
- Android reaccionar nativo no pudo obtener lotes puente
- Requerir módulo desconocido "ReactPerf" al integrar React Native con la aplicación Android existente
- reaccionar-nativo cómo agregar la imagen y onpress en touchable
- Eventos personalizados en React Native Componente nativo de la interfaz de usuario de Android
- Uso de sensores en Android con React Native
- Cómo utilizar una actividad de Android en React Native
- Cómo devolver un booleano de @ReactMethod en React Native?
Por último, después de buscar en las fuentes de reaccionar js, he descubierto la solución, es necesario:
- Extender JavaScriptModule y pasarlo al método createJSModules del paquete de reacción personalizado (por ejemplo ActionsModule.java).
- Registre ese paquete dentro de usted reaccione el método getPackages de la actividad o piense directamente ReactInstanceManager
- Cree un archivo js con el mismo nombre en su código js
- Registrelo con BatchedBridge como se describe en el listado a continuación.
-
Después de reactivar el contexto inicializar, puede obtenerlo y llamar a través de:
ActionsModule jsModule = context.getJSModule (ActionsModule.class); JsModule.callAction ("saludo", "hola");
Que llamará a su método js módulo registrado asincrónicamente.
// AppPackage.java public class AppPackage implements ReactPackage { @Override public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) { return Collections.emptyList(); } @Override public List<Class<? extends JavaScriptModule>> createJSModules() { return Arrays.<Class<? extends JavaScriptModule>>asList( ActionsModule.class ); } @Override public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) { return Collections.emptyList(); } } // ActionsModule.java public interface ActionsModule extends JavaScriptModule { void callAction(String type, String value); } // MyReactActivity.java public class MyReactActivity extends ReactActivity implements ReactInstanceManager.ReactInstanceEventListener { ... @Override public void onReactContextInitialized(ReactContext context) { ActionsModule jsModule = context.getJSModule(ActionsModule.class); jsModule.callAction("greet", "hello"); } ... }
// ActionsModule.js var ActionsModule = { callAction(type, value) { console.log("callAction => " + type + ":" + value); }, } module.exports = ActionsModule; // index.android.js import { AppRegistry } from 'react-native'; import App from './components/App'; // js module registration var BatchedBridge = require('BatchedBridge'); var ActionsModule = require('./ActionsModule'); BatchedBridge.registerCallableModule( 'ActionsModule', ActionsModule ); //~ js module registration AppRegistry.registerComponent('MyApp', () => App);
UPD> Empujó un proyecto de demostración a github con una solución para android y ios: https://github.com/dmba/rct-native2js
No estoy seguro de que sea posible, pero ¿por qué querrías hacer esto de todos modos? Utilice NativeAppEventEmitter / DeviceEventEmitter y simplemente envíelo como un evento que escuchará en el lado de JS.
- Cómo utilizar las vistas declaradas en un archivo xml de diseño en otro diseño
- Cómo obtener el texto ellipsizado en un TextView