Skip to main content

Що робить ViewModel у MVVM?

Патерни проєктуванняMiddle~2 хв читання
Запропонувати правку

ViewModel в архітектурі MVVM (Model-View-ViewModel) - це центральний шар, який пов'язує дані (Model) та інтерфейс (View). Вона керує всією презентаційною логікою: зберігає стан екрана, обробляє дії користувача й оновлює дані, при цьому нічого не знаючи про сам інтерфейс.

1. Основна роль ViewModel

ViewModel - це "мозок" інтерфейсу. Вона знає, що має бути показано, але не знає, як це виглядає.

2. Основні обов'язки

1. Зберігає стан екрана

Містить усі дані, що потрібні для відображення View: текст, списки, прапорці завантаження, помилки тощо. Коли ці дані змінюються - View оновлюється автоматично через data binding.

Приклад: isLoading = true → View показує індикатор завантаження, userName = "Марія" → текст на екрані змінюється без додаткового коду.

2. Обробляє дії користувача

При кліках, свайпах, введенні даних ViewModel отримує подію від View і вирішує, що робити:

  • викликає методи Model,
  • оновлює стан,
  • повідомляє View, що дані змінилися.

Приклад: Користувач натиснув кнопку "Зберегти" → ViewModel.saveUser() викликає Model.save(), після завершення оновлює saveStatus = "успішно".

3. Організовує зв'язок між View і Model

ViewModel - посередник, який перетворює "сирі" дані з моделі в зручний формат для відображення:

  • форматує дати, числа, валюту;
  • фільтрує або сортує списки;
  • об'єднує дані з різних джерел.

Приклад: user.birthDate з моделі перетворюється на "25 років" для View.

4. Нічого не знає про View

ViewModel не має посилань на UI-компоненти (кнопки, поля, елементи інтерфейсу). Вона просто надає дані й команди - а View "підписується" на них.

Це дає можливість:

  • тестувати ViewModel окремо від інтерфейсу,
  • використовувати ту саму ViewModel з різними View (наприклад, екран і віджет).

3. Принцип роботи (взаємодія шарів)

javascript
Користувач → View ↔ ViewModel ↔ Model
  1. Користувач взаємодіє з View (натискає кнопку).
  2. View викликає команду в ViewModel (onLoginClicked()).
  3. ViewModel викликає методи Model (auth.login()), отримує результат.
  4. Оновлює свої властивості (isLoading, userInfo).
  5. View автоматично оновлюється через binding.

4. Приклад на псевдокоді

kotlin
class UserViewModel { val userName = ObservableField<String>() val isLoading = ObservableField<Boolean>() fun loadUser() { isLoading.set(true) userRepository.getUser { user -> userName.set(user.name) isLoading.set(false) } } }

View просто "підписана" на userName і isLoading - і при їх зміні автоматично оновлює інтерфейс.

Підсумок:

ViewModel - це сполучна ланка між інтерфейсом і даними. Вона керує станом, логікою й командами, забезпечує реактивне оновлення View, і робить можливим тестування логіки без запуску інтерфейсу.

Коротка відповідь

Для співбесіди
Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.

Запропонувати правку