web-dev-qa-db-fra.com

Comment organiser React Native avec les fichiers de projet Realm?

J'ai choisi un domaine pour stocker des données dans mon React application native. Je ne comprends pas comment organiser les fichiers dans mon projet. La documentation ne fournit que du code simple pour un composant. Mais j'ai besoin de différents composants différentes parties de la base de données.

J'ai vu dans un référentiel, où tous les schémas ont été passés au tableau dans le fichier "configureRealm.js":

new Realm({schema: [Dogs, Cats]});

J'ai aussi découvert que je peux mettre différents schémas dans le répertoire "schémas", par exemple et les importer où j'ai besoin.

Par exemple, dans le composant "Cats.js", je peux faire:

import Cats from 'schemes/Cats';

this.realm = new Realm({schema: [Cats]});

Et dans "Dogs.js", importez les chiens et initialisez le domaine avec ce schéma.

Mais je ne suis pas sûr en premier et à moi. Quel sera le meilleur moyen d'organiser l'application native realm react?

javascriptreact-nativerealm
20
inferus-vv

J'ai récemment commencé à organiser ma structure App/Data comme ceci, lorsque j'ai affaire à Realm, après avoir reçu des instructions de quelqu'un de bien plus intelligent que moi :) Je ne suis pas entré dans trop de détails sur la façon dont les Realms sont initialement créés, comme je suppose que vous gérer cela déjà. Il s'agit simplement d'une structure vraiment solide pour l'organisation/le développement compartimenté. J'espère que ça aide!

.App
    ├──Assets
    ├──Data
    |   ├──Db
    |   |   ├──Db.js
    |   |   ├──DbHelper.js
    |   ├──Models
    |   |   ├──ModelA.js
    |   |   ├──ModelB.js
    |   |   ├──ModelC.js
    |   ├──Queries.js
    ├──Scenes
    |   ├──App.js
    |   |   ├──(all other scene/view components)

- Le répertoire Modèles contient tous mes schémas, répartis individuellement comme ceci:

import Realm from 'realm';
export default class ModelA extends Realm.Object {}
ModelA.schema = {
    name: 'ModelA',
    primaryKey: 'id',
    properties: {
        one: {type: 'int', optional: true},
        two: 'string',
        three: {type: 'string', optional: true},
    }
}

--Dans Db.js, Je conserve toutes mes méthodes standard liées au domaine. createRealm(), write(), close(), insert(), et une méthode de requête générique, comme ceci:

query(model: string, filter?: string) {
    let results = this.realm.objects(model);
    if(filter) {
        return results.filtered(filter);
    }
    return results;
}

- DbHelper.js Importe ensuite Db.js Et tous mes modèles. Il gère le paramétrage et l'obtention de mes instances de base de données, en utilisant les méthodes standard de Db.js, Comme ceci:

import Db from 'App/Data/Db/Db';
import ModelA from 'App/Data/Models/ModelA';
import ModelB from 'App/Data/Models/ModelB';
import ModelC from 'App/Data/Models/ModelC';

class DbHelper {

    modelSchema = [
        ModelA,
        ModelB,
        ModelC
    ];

    activeInstancePath = (myLocalRealmPath)

    getInstance(): Db {
        let instance: Db = this.activeInstancePath;
        if(!instance) {
            throw new Error('DbHelper.js :: Active Instance Not Set!');
        }
        return instance;
    }

    /* note: this is where you would also setInstance and define a constant, or other method for the instance path */
}

- Queries.js Importe ensuite DbHelper.js. Queries.js Contient toutes mes méthodes pour des requêtes de données spécifiques à une application. Queries.js Est tout ce dont j'ai besoin pour importer dans mes composants Scene, pour obtenir des données de domaine. Mon Queries.js Ressemble à ceci:

import DbHelper from 'App/Data/Db/DbHelper';

class Queries {

    /* a typical query */
    getSomeDataFromModelA(filterValue: string = null) {
        let filter = null;
        if (filterValue) {
            filter = `two = ${filterValue}`;
        }
        let results = DbHelper.getInstance()
            .query('ModelA', filter);

        return results;
    }

    /* return some JSON data that we originally stored in the Realm as a string */
    getSomeJsonData() {
        let results = DbHelper.getInstance()
            .query('ModelB');

        if(results.length) {
            let parsed = JSON.parse(results[0].objectA);
            return parsed.objectB;
        }
        return null;
    }
}
export default new Queries();

--App.js. Alors maintenant, dans ma scène d'application, je ferais simplement quelque chose comme ceci:

import React, { Component } from 'react';
import { View, Text } from 'react-native';
import Queries from 'App/Data/Queries';

class App extends Component {

    constructor(props) {
        super(props);

        // Get Some Realm Data!
        let modelAData = Queries.getSomeDataFromModelA()
        let someJsonData = Queries.getSomeJsonData();

        // Set Initial state
        this.state = {
            modelData: modelAData,
            jsonData: someJsonData
        }
    }

    componentDidMount() {
        console.log(this.state.modelData);
    }

    render() {
        return(
            <View>
                <Text>{this.state.jsonData.objectKey}</Text>
            </View>
        );
    }
}

export default App;
28
fostertime

Dans l'exemple du référentiel github de Realm, tous les modèles sont définis et exportés à partir d'un fichier unique: https://github.com/realm/realm-js/blob/master/examples/ReactExample/components/realm.js

Ensuite, cela est requis dans toute l'application et utilisé au besoin.

1
Ari