Собственные броски MobX React не могут прочитать свойство undefined

Я пытаюсь передать один магазин mobX другому магазину, вот коды моих магазинов:

Магазин класса 1:

export default class APIKeyStore
{
    @persist @observable apiKey = '****';
}

Магазин класса 2:

export default class ServiceCalls
{
    @persist @observable apiKeysStore;

    constructor(apiStore)
    {
        this.apiKeysStore = apiStore; 
        console.log('constructor', this.apiKeysStore.apiKey);
    }

    @action async initializeApp()
    {
        console.log('initializeApp', this.apiKeyStore.apiKey);
    }
}

index.js:

import APIKeyStore from './models/APIKeyStore';
import ServiceCalls from './models/ServiceCalls';

const serviceCalls = new ServiceCalls(new APIKeyStore())

const stores = {
  serviceCalls: serviceCalls
}

export default
{
  ...stores
};

Компонентный файл, в котором я вызываю метод store 2 initializeApp ():

@inject('serviceCalls')
@observer
class ZeroStepScreen extends Component
{
  async componentWillMount()
  {
    try
    {
      console.log('componentWillMount', this.props.serviceCalls.apiKeysStore.apiKey);
      await this.props.serviceCalls.initializeApp();
    }
    catch(e)
    {
      console.log(e);
    }
  }
}

В приведенных выше классах у меня есть три объявления console.log(..), в которых сообщается о правильных результатах методов constructor второго хранилища и componentWillMount() методов компонента.

При вызове того же метода initializeApp() класса 2-го хранилища, this.apiKeysStore.apiKey всегда выдает мне не удается прочитать свойство undefined.

Конструктор 2-го класса - console.log(this.apiKeysStore.apiKey) - ОК

ZeroStepScreen - console.log(this.props.serviceCalls.apiKeysStore.apiKey) - ОК

InitializeApp () 2-го класса - console.log(this.apiKeysStore.apiKey) - Ошибка

Я не могу понять, что я делаю неправильно, что второй класс хранилища становится неопределенным при доступе к this.apiKeysStore.apiKey, когда его конструктор сообщил правильно, класс компонента сообщил правильно.


react-native mobx mobx-react mobx-persist
person Santanu Karar    schedule 10.09.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Я не совсем уверен в основах (как поступать таким образом), но в конечном итоге у меня сработал следующий способ:

@action async initializeApp()
{
   console.log(this.getAPIKeyStore()).apiKey);
}

getAPIKeyStore()
{
  return this.apiKeysStore;
}

Вероятно, использование async не позволило мне напрямую получить доступ к наблюдателю уровня класса.

person Santanu Karar    schedule 10.09.2018