Как правильно получить доступ к данным, извлеченным из избыточной функции thunk?

Question

В настоящее время я использую этот шаблон, но он кажется немного неправильным. Я не думаю, что избыточный поток должен возвращать строку, а компонент должен получать доступ только к данным, извлеченным через подключенный реквизит. Я могу ошибаться, но есть ли лучший, более идиоматический способ сделать это?

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

// actions
const putCustomer = ...;
const putBooking = ...;

// thunks
export async function fetchCustomer(customerId) {
  return dispatch => {
    const customer = await customerApi.fetch(customerId);
    dispatch(actions.putCustomer( {customer} ));
  };
}

export async function fetchBooking(bookingId) {
  return dispatch => {
    const booking = await bookingApi.fetch(bookingId);
    dispatch(actions.putBooking( {booking} ));

    // I AM RETURNING THE BOOKING DATA HERE
    return booking;
  };
}

// component
class MyComponent extends React.Component {
  async componentWillMount() {
    const booking = await this.props.dispatch(fetchBooking(this.props.bookingId));

    // I WANT TO ACCESS THE BOOKING DATA HERE
    this.props.dispatch(fetchCustomer(booking.customerId));
  }
}

ВОПРОС ОБНОВЛЕН

• Добавлены некоторые комментарии, где я хочу получить доступ к данным

Answer 1

В идеальном случае ниже показано, как происходит поток, если вы отправляете какое-либо действие:

Предполагается, что пользовательский интерфейс может бытьпривязка к состоянию и состоянию была изменена редуктором, это однонаправленный поток.Данные, которые вы пытаетесь вернуть, могут управляться через состояние, и диспетчер может изменить это состояние