JSONStore en aplicaciones React Native

Requisitos previos

• Lea la Guía de aprendizaje principal de JSONStore
• Asegúrese de que el SDK básico de MobileFirst React Native se haya añadido al proyecto. Siga la guía de aprendizaje de Adición del SDK de Mobile Foundation a aplicaciones React-Native.

Ir a:

• Adición de JSONStore
• Uso básico
• Aplicación de ejemplo

Adición de JSONStore

Para añadir el plugin JSONStore a su aplicación React Native:

1. Abra una ventana Línea de mandatos y vaya a la carpeta del proyecto de React Native.
2. Ejecute el mandato:

    npm install react-native-ibm-mobilefirst-jsonstore --save
   

3. Solo para iOS, instale las dependencias de Mobilefirst Pod

   cd ios && pod install
   

Uso básico

Creación de una nueva recopilación JSONStore

1. Utilizamos la clase JSONStoreCollection para crear instancias de JSONStore. También podemos establecer configuración adicional para esta recopilación JSONStore que se acaba de crear (por ejemplo, estableciendo campos de búsqueda).
2. Para empezar a interactuar con una recopilación JSONStore existente (por ejemplo: añadiendo o eliminando datos) debemos Abrir la recopilación. Utilizamos la API openCollections() para hacer lo siguiente.

   var collection = new JSONStoreCollection('people');
   WLJSONStore.openCollections(['people'])
   .then(res => {
   	// handle success
   }).catch(err => {
   	// handle failure
   });
   

Añadir

Utilice la API addData() para añadir datos JSON en una recopilación.

var data = { "name": "John", age: 28 };
var collection = new JSONStoreCollection('people');
collection.addData(data)
.then(res => {
  // handle success
}).catch(err => {
  // handle failure
});

Puede añadir un único objeto JSON o una matriz de objetos JSON mediante esta API.

Encontrar

1. Utilice find para encontrar documentos dentro de una recopilación utilizando una consulta.
2. Utilice la API findAllDocuments() para recuperar todos los documentos de una recopilación.
3. Utilice las API findDocumentById() y findDocumentsById() para utilizar el identificador de documento exclusivo.
4. Utilice la API findDocuments() para consultar la recopilación. Para la consulta, puede utilizar los objetos de clase JSONStoreQueryPart para filtrar los datos.

Pase una matriz de objetos JSONStoreQueryPart como parámetro a la API findDocuments.

var collection = new JSONStoreCollection('people');
var query = new JSONStoreQueryPart();
query.addEqual("name", "John");
collection.findDocuments([query])
.then(res => {
	// handle success
}).catch(err => {
	// handle failure
});

Eliminar

Utilice remove para suprimir un documento de una recopilación.

var id = 1; // for example
var collection = new JSONStoreCollection('people');
collection.removeDocumentById(id)
.then(res => {
	// handle success
}).catch(err => {
	// handle failure
});

Eliminar recopilación

Utilice removeCollection para suprimir todos los documentos que se almacenan dentro de una recopilación. Esta operación es similar a descartar una tabla en términos de una base de datos.

var collection = new JSONStoreCollection('people');
collection.removeCollection()
.then(res => {
	// handle success
}).catch(err => {
	// handle failure
});

Aplicación de ejemplo de JSONStore de IBM MobileFirst

Descargue el ejemplo aquí.

Ejecución del ejemplo

En el directorio raíz del ejemplo, ejecute el mandato siguiente, que instala todas las dependencias de proyecto:

npm install

Nota: Asegúrese de que mfpclient.properties y mfpclient.plist apuntan a la instancia correcta de MobileFirst Server.

1. Registre la aplicación. Vaya al directorio android y ejecute el mandato siguiente:

    mfpdev app register
   

2. Configuración de la aplicación. (Para Android solamente)

   • Abra el archivo android/app/src/main/AndroidManifest.xml desde el directorio raíz del proyecto de React Native.
     Añada la línea siguiente a la etiqueta <manifest>:
     xmlns:tools="http://schemas.android.com/tools"
     Añada la línea siguiente a la etiqueta <application>x:
     tools:replace="android:allowBackup"
     
     Este paso lo requiere la biblioteca react-native-ibm-mobilefirst.
     

   • Abra el archivo android/app/build.gradle desde el directorio raíz del proyecto de React Native.
     Añada el código siguiente en android {}:
     

     packagingOptions{
     	exclude 'META-INF/ASL2.0'
     }
     

     Este paso lo requiere la biblioteca react-native-ibm-mobilefirst-jsonstore.

3. Ejecución de la aplicación. Vuelva al directorio raíz y vaya al directorio iOS y ejecute el mandato: mfpdev app register

Ahora estamos listos para ejecutar la aplicación. Para la ejecución android, ejecute el mandato siguiente:

react-native run-android