Non sono stato in grado di trovare qualcosa di simileReact Native ha portata globale? In caso contrario, come posso simularlo?
$rootScope
per reagire nativi e voglio condividere un paio di variabili tra le diverse viste.
La memorizzazione di variabili nell'ambito globale è un po 'un anti-pattern in React. React è concepito per essere utilizzato con un flusso di dati a senso unico, il che significa che i dati scorrono dai componenti ai loro figli. Questo risultato è ottenuto tramite the passing of props.
Per condividere un valore tra più viste, è necessario memorizzare i dati su un componente padre condiviso e inviarlo come prop OPPURE memorizzarlo in un'entità separata responsabile della gestione dei dati. In ReactJS questo è ottenuto attraverso pattern come Flux, ma non sono sicuro delle opzioni per react-native.
Ad esempio, è possibile esportare la classe con proprietà statiche e quindi importarla quando necessario.
In main.js ad esempio:
export class AppColors {
static colors = {main_color: "#FFEB3B", secondary_color: "#FFC107"}
}
In un altro file, in cui bisogno di ottenere questi colori
import { AppColors } from './main.js';
class AnotherPage {
constructor() {
super();
console.log(AppColors.colors); // youla! You will see your main and secondary colors :)
}
}
È possibile aggiungere metodi o funzioni statiche in AppColors e come utilizzarlo. – YLS
L'ambito globale nel Reagire nativa è variabile globale.
global.foo = foo
Quindi è possibile utilizzare global.foo ovunque.
Ma non abusarlo! A mio parere, l'ambito globale può essere utilizzato per memorizzare la configurazione globale o qualcosa del genere. Condividi le variabili tra diverse viste, come descrizione, puoi scegliere molte altre soluzioni (usa redux, flux o memorizzale in un componente più alto), l'ambito globale non è una buona scelta.
Una buona pratica per definire la variabile globale consiste nell'utilizzare un file js. Per esempio global.js:
global.foo = foo;
global.bar = bar;
Poi, per assicurarsi che viene eseguita quando il progetto inizializzato. Ad esempio, importare il file in index.js:
import './global.js'
// other code
Ora, è possibile utilizzare la variabile globale da nessuna parte, e non hanno bisogno di importare global.js in ogni file. Cerca di non modificarli!
Grazie per la segnalazione, volevo accedere ad alcune configurazioni globali dai miei contenitori reattivi e dai servizi, e questo mi ha aiutato. Tuttavia non ho dovuto importare global.js però. Potrei semplicemente usare global.foo = foo –
A mio parere, la variabile globale non dovrebbe essere modificata mentre l'app è in esecuzione. Quindi se scrivi semplicemente global.foo = foo in qualche componente o codice logico, quando vuoi usare foo, non sei sicuro che sia stato inizializzato prima. O forse qualcuno riassegnerà foo in un altro codice. In global.js, il valore di tutte le variabili globali è chiaro. Importa nel index.js, per assicurarti che tutte le variabili globali siano definite e puoi usarle ovunque! – Germinate
Può essere utilizzato per funzioni globali? – fungusanthrax
È possibile memorizzare tali valori nello stato dei componenti principali. Quindi passare metodi che cambiano tali valori tramite oggetti di scena o contesto/o come @Jakemmarsh suggerito - utilizzare l'approccio Flux/Redux.
O, è possibile utilizzare AsyncStorage. È utile per archiviare dati dell'app come token e così via.
I link Flux e Redux sono interrotti ... –
D'accordo sul fatto che questo è generalmente un antipattern, ma ciò non significa che non si dovrebbe mai utilizzare globals in qualsiasi circostanza. React Native stesso definisce una variabile globale in Javascript chiamata '__DEV__'. Come è fatto e come posso creare qualcosa di simile, ad es. '__MYDEV__'?(Sembra che questo potrebbe non essere possibile e che la cosa più vicina che puoi ottenere è una [variabile di ambiente] (http://stackoverflow.com/questions/33117227/setting-environment-variable-in-react-native)). –