Как правильно организовать вызовы API во Flutter для моделей представлений? - PullRequest
1 голос
/ 17 января 2020

Я начал изучать Flutter около месяца go, и я прочитал и посмотрел несколько хороших учебных пособий, лучшим из которых является адаптивная архитектура с провайдером и модели просмотра для предотвращения повторения кода при создании приложений.

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

Вот как я сделал это. Я думал о создании сервиса api.dart, который реализует методы пакета http. Пока это только get(), но я уже вижу, что другие в конечном итоге будут слишком много повторять условие.

class Api {
  Future<dynamic> get(String url) async {
    final response = await http.get('$kBaseUrl/$url');

    if (response.statusCode != 200) {
      throw Exception(json.decode(response.body)[0]['mensagem']);
    }

    return json.decode(response.body);
  }
}

Затем в единственной модели представления, которую я пока имею, я реализую get() из api.dart при нажатии кнопки, например. model внутри кнопки - это то, как выполняется архитектура 1015 *, о которой я упоминал выше.

Future<void> submit() async {
  print('Email: $email, password: $password');
  get();
}

Future get() async {
  _setBusy(true); // loading status on
  _setError(''); // clean errors

  try {
    await _api.get('clientes');
  } catch (e) {
    _setError(e.message);
  }

  _setBusy(false); // loading status off
}
PrimaryButton(
  onTap: () {
    model.submit();
  },
  disabled: model.busy, // the loading state to modify the styling of the button
),

И это все. У меня такое ощущение, что это могло бы быть намного лучше, и я бы предпочел, чтобы с самого начала был наилучший возможный способ, чтобы я мог больше узнать о структурировании своих файлов и поддержании их в чистоте по мере роста приложения. Я буду признателен за любые инструкции, код, статью, видео и / или хранилище.

1 Ответ

2 голосов
/ 17 января 2020

Отличный вопрос, @ gamofe.

Что касается файловой структуры, Flutter все еще немного дикого запада. Тем не менее, в моих проектах и ​​в подавляющем большинстве учебных пособий, которые я читал, структура папок выглядит следующим образом:

lib/src
lib/src/repositories
lib/src/repositories/common
lib/src/repositories/user
lib/src/repositories/user/user_repository.dart
lib/src/repositories/item/item_repository.dart
lib/src/blocs
lib/src/blocs/user
lib/src/blocs/user/barrel.dart
lib/src/blocs/user/user_state.dart
lib/src/blocs/user/user_events.dart
lib/src/blocs/user/user_bloc.dart
lib/src/models/user.dart
lib/src/screens/login_screen.dart
lib/src/screens/item_feed.dart
lib/src/widgets

Кроме того, я бы сказал, что крайне редко вы должны делать Вызов API напрямую из вашего слоя просмотра. Я бы порекомендовал читать по шаблону BLo C. Это общепринятый (и рекомендуемый Google) метод управления состоянием в приложениях Flutter.

По сути, BLo C - это поток. По вашему мнению, вы слушаете новые события состояния из потока. Если вы хотите обновить данные, вы «отправляете» новое событие в поток, которое в конечном итоге преобразуется в вывод состояния.

Реализация шаблона Blo c в вашем приложении поможет вам достичь разделения и DRY код, который вы ищете.

Flutter Blo c - это вспомогательная библиотека, которая поможет вам начать работу с шаблоном Blo c. Документация довольно хорошая, примеров много. Есть документы, в которых дается краткий обзор того, как достаточно хорошо управлять отношениями между представлениями, состоянием и сетевыми запросами.

FWIW, Я собрал пример приложения Flutter , которое реализует все эти концепции. Я использую его для каждого нового проекта, чтобы помочь мне быстро раскачиваться. Не стесняйтесь ковыряться. Я приложил все усилия, чтобы следовать передовым методам, поэтому, надеюсь, он послужит достойной моделью.

...