Как передать обещание как опору с помощью mobx

Question

В моем файле App.js у меня есть следующий код:

  import stores from 'client/stores';
  ...
  ...
  render() {
     return (
        <Provider {...stores}>
          <SafeAreaView>
            <AppContainer />
          </SafeAreaView>
       </Provider>
     );
  }

Я хочу получить свои данные из бэкэнда и вставить их в AppContainer. Однако его нужно получить асинхронно, используя обещание:

// client/stores/index.js

boardsService.retrieveBoards().then(boards => {
    // I need to store boards here 
})

Затем вставьте доски в мой AppContainer

export default
@inject('boards')
@observer
class AppContainer extends React.Component {
  constructor(props) {
     super(props);
     console.log(props.boards); 
  }

  render() {
     ...
  }
}

Я попробовал это в store / index.js:

async function connect() {
  const connection = await boardsService.retrieveBoards();
  if (connection) {
    return connection;
  }
  return null;
}

connect().then(boards => {
  exports.boards = boards;
}); 

Но я получаю эту ошибку:

Answer 1

Во-первых, Actions в Mobx не имеет возвращаемого значения. Они просто меняют наблюдаемые свойства. Неважно, является ли действие синхронным или асинхронным.

@observable boards = [];

boardsService.retrieveBoards().then(boards => {
 this.boards.replace(boards);
})

Во-вторых, вы должны разыменовывать наблюдаемое свойство только в функции рендеринга, а не в конструкторе.