Как понять js, object и асинхронность?

Question

[Роман]

Добрый день, есть вот такой вот метод с конструктором, оч просто

export default class Transaction {

public constructor(authToken: string) {
        this.userToken = authToken;
        this.transactions = [],
        this.page = {};
    }

public async all() {
        let Response: Type.Transaction.Response = await axios.get(process.env.API_URL + 'transaction/all');

        this.page = {
            current: Response.data.data.current_page,
            last: Response.data.data.last_page
        }

        this.transactions = Response.data.data.data
        // тут уже в this всё обновлено и я рад
    }
// -- //
}

Создаю его экземпляр через 'new', и передаю его как 'prop' в компонент, на этом всё окей

<LoadScroll classData={new Action.Api.Transaction(this.props.Store.Auth.token)}>
// -- //
</LoadScroll>

И вот внутри уже

componentDidMount() {
  this.props.classData.all()
      .then(() => {
        // и вот тут я ожидаю, что запрос успешен и мой экземпляр будет обновлён, верно?
       console.log('1', this.props.classData) // всё ок, и transaction вижу и page
       console.log('2', this.props.classData.transactions) // а вот тут уже пусто! каааак?
      })
}

Я определённо заплутал и не до конца понял либо асиннхроность, либо это у React что-то неявное, или что-то еще? В какую сторону погуглить и что почитать?

Comments

[Сергей Сунцев]

Не надо велосипедов.
Вам сюда, https://ru.reactjs.org/docs/components-and-props.html - тут как создаются компоненты. Наследуйте классы от React.Component
А тут https://ru.reactjs.org/docs/state-and-lifecycle.html рассказывается, как меняется состояние этих компонентов.

[Павел Диденко]

Если код небольшой, выложите лучше в песочницу

Answer 1

[grinat]

Вероятно верхний компонент перерендерился и был передан новый инстанс класса, в котором нет ничего.

Answer 2

[Роман]

Решил всё, завернув в переменную.

const parentMethod = this.props.classData;
parentMethod.all()
  .then(()=> {
    this.props.returnData(parentMethod.transactions || []);
  })

На вопрос я конечно не ответил для себя, думаю надо поднимать дебагер и смотреть. А вообще grinat думаю проблема может быть именно в этом, но ответом пометить не могу, прости.