ios - Reaccionar nativo Crear componente/biblioteca personalizada

objective-c cocoa

Question

En React Native, hay ciertos componentes de terceros que compilan sus propias bibliotecas que pueden incluirse en su proyecto principal React. Ejemplos de tales bibliotecas de terceros son estos:

• https://github.com/naoufal/react-native-touch-id
• https://github.com/lazaronixon/react-native-qrcode-reader
• https://github.com/brentvatne/react-native-modal

Ahora, me gustaría mucho crear mi propio componente React Native con una biblioteca vinculada (solo para iOS, por lo que solo necesito la biblioteca Cocoa que enlazaría con este método: https://facebook.github.io/react-native/docs/linking-libraries-ios.html ), y hasta ahora, todo lo que encontré es el siguiente: http://moduscreate.com/react_native_custom_components_ios/

Sin embargo, el proyecto resultante no especifica un destino de biblioteca y no se puede vincular a un proyecto diferente.

También he intentado copiar el repositorio de Touch ID e intentar cambiar el código de uno, pero lamentablemente, no se puede compilar sin haber sido referenciado desde un proyecto diferente, que a su vez sería el que se compilaría.

¿Dónde puedo encontrar guías sobre cómo hacer eso? ¡Gracias!

Answer 1

1. Comando: nueva-biblioteca

React-native-cli ofrece el comando new-library :

react-native new-library --name <YourNewLibraryName>

Llamar a esto generará una biblioteca de muestra en su directorio de Libraries copiando el archivo de muestra desde la biblioteca nativa de reacción .

2. Desarrollando

React Native tiene un par de documentos específicamente para escribir módulos nativos y componentes nativos de IU , según lo que quieras lograr.

3. Componente de enlace

Enlace su componente una vez que haya terminado siguiendo las instructions que ya mencionó.

Answer 2

Crear componente en reaccion-native:

const App = ( ) => {
  return (
    <Text>Some Text</Text>
  );
}

Para registrar este componente debes usar:

ReactNative.AppRegistry.registerComponent(''your_project_name'', ( ) => App);