React native和MobX：如何创建全球商店？

Question

我目前想实现一个mobx存储，我可以从任何地方拨打像这样：

import {userStore} from '../UserStore.js'; 

在文件的结尾，我导出功能如下所示：

const userStore = new UserStore(); 
export {userStore}; 

正如我明白，每次我调用import功能时，都会重新创建对象，导入UserStore的多个文件不会共享相同的变量。

但是，我希望每个导入的文件UserStore都导入具有完全相同变量的相同对象。我怎样才能做到这一点？我不完全确定如何实现，所以任何想法和示例将不胜感激:)

完整的代码（UserStore.js声明），如果有任何帮助，如下所示（查看底部的出口语句）

import {observable, computed, action} from 'mobx'; 
import {ObservableMap, toJS} from 'mobx'; 
import {Fb} from './firebase.js'; 

class UserStore { 

    /** GPS */ 
    @observable usrLng = 0.0; 
    @observable usrLat = 0.0; 
    @observable watchID = null; 

    @action 
    watchCurLocation() { 
    this.watchID = navigator.geolocation.watchPosition((position) => { 
     console.log("Recording GPS data from within the Store!!"); 
     this.usrLat = parseFloat(position.coords.latitude); 
     this.usrLng = parseFloat(position.coords.longitude); 
     }, (error) => console.log(JSON.stringify(error)), { 
     enableHighAccuracy: true, 
     timeout: 2000, 
     maximumAge: 1000 
     }); 
    } 

    @action 
    clearWatch() { 
    navigator.geolocation.clearWatch(this.watchID); 
    } 
    /*/ GPS */ 

    /** BIKE BOOKING */ 
    @observable interestBikeNo = -1; 
    @observable bookedBikeNo = -1; 

    @action 
    setInterestBikeNo(bn) { 
    this.interestBikeNo = bn; 
    } 

} 

const userStore = new UserStore(); 
export {userStore}; 

Answer 1

您只需UserStore类的单一实例

样品演示

let localInstance = null; 

export class Apple { 
    static newInstance() { 
    if (! localInstance) 
     localInstance = new Apple(); 
    return localInstance; 
    } 
} 

// usage 

import {Apple} from './apple'; 
const instance = Apple. newInstance(); 

在你的情况，你可以用一个简单的函数

import {observable, computed, action} from 'mobx'; 
import {ObservableMap, toJS} from 'mobx'; 
import {Fb} from './firebase.js'; 

class UserStore { 
    // omitted 
} 

let userStore; 
export function getUserstore() { 
    if (!userStore) 
    userStore = new UserStore(); 
    return userStore; 
}; 

某处代码

// instead of 
import {userStore} from './someUserStoreModule'; 

// use 
import {getUserstore} from './someUserStoreModule'; 
const userStore = getUserstore();