WordPress DemoSite

Тестовый сайт для экспериментов и демонстраций возможностей

MVVM (Model-View-ViewModel) — архитектурный паттерн для разделения логики и интерфейса

MVVM — это современная альтернатива MVP и MVC, где ViewModel выступает посредником между Model (данные) и View (интерфейс), обеспечивая автоматическое обновление UI через data binding или реактивные потоки (например, LiveData, StateFlow).


🔥 Основные компоненты MVVM

КомпонентРольПример в Android/Kotlin
ModelДанные и бизнес-логика (API, БД, репозитории).UserRepository, ApiService
ViewОтображает данные и передает действия пользователя во ViewModel.Activity, Fragment, Composable
ViewModelХранит состояние UI и обрабатывает логику. Не зависит от View.UserViewModel

Как работает MVVM?

  1. View реагирует на действия пользователя (например, нажатие кнопки) и вызывает метод ViewModel.
  2. ViewModel запрашивает данные у Model.
  3. Model возвращает результат (например, список из БД).
  4. ViewModel обновляет свое состояние (LiveData/StateFlow).
  5. View автоматически отображает новые данные (через подписку на изменения).

🛠 Пример MVVM в Android (Kotlin + Jetpack)

1. Model (Repository)

class UserRepository {  
    suspend fun getUsers(): List<String> {  
        delay(1000)  // Имитация сетевого запроса  
        return listOf("Alice", "Bob", "Charlie")  
    }  
}  

2. ViewModel

class UserViewModel(private val repository: UserRepository) : ViewModel() {  
    private val _users = MutableStateFlow<List<String>>(emptyList())  
    val users: StateFlow<List<String>> = _users  

    fun loadUsers() {  
        viewModelScope.launch {  
            _users.value = repository.getUsers()  
        }  
    }  
}  

3. View (Activity/Fragment)

class UserActivity : AppCompatActivity() {  
    private val viewModel: UserViewModel by viewModels()  

    override fun onCreate(savedInstanceState: Bundle?) {  
        super.onCreate(savedInstanceState)  
        binding.button.setOnClickListener {  
            viewModel.loadUsers()  // Запускаем загрузку  
        }  

        // Подписываемся на изменения данных  
        lifecycleScope.launch {  
            repeatOnLifecycle(Lifecycle.State.STARTED) {  
                viewModel.users.collect { users ->  
                    binding.recyclerView.adapter = UserAdapter(users)  
                }  
            }  
        }  
    }  
}  

🌟 Преимущества MVVM

Автоматическое обновление UI (через LiveData/StateFlow).
Тестируемость: ViewModel не зависит от Android-компонентов.
Нет утечек памяти: ViewModel переживает смену конфигурации (например, поворот экрана).
Гибкость: Можно использовать с Jetpack Compose, Data Binding.


📉 Недостатки MVVM

Сложнее для новичков (нужно понимать reactive-потоки).
Избыточность для простых проектов.


🆚 MVVM vs. MVP

КритерийMVVMMVP
Связь View-логикаЧерез подписку на данныеЧерез интерфейсы
ТестируемостьЛегко (Mock Repository)Легко (Mock View)
Жизненный циклАвтоматический (ViewModel)Ручное управление

Когда выбирать MVVM?

Когда выбирать MVP?


🚀 MVVM в других платформах

iOS (Swift + Combine)

class UserViewModel: ObservableObject {  
    @Published var users: [String] = []  
    private let repository = UserRepository()  

    func loadUsers() {  
        repository.getUsers { [weak self] users in  
            self?.users = users  
        }  
    }  
}  

// Во View:  
struct UserView: View {  
    @StateObject var viewModel = UserViewModel()  

    var body: some View {  
        List(viewModel.users, id: \.self) { user in  
            Text(user)  
        }  
        .onAppear { viewModel.loadUsers() }  
    }  
}  

Web (JavaScript + Vue/React)

// Vue 3  
const UserViewModel = {  
    data() {  
        return { users: [] }  
    },  
    methods: {  
        loadUsers() {  
            UserRepository.getUsers().then(users => this.users = users)  
        }  
    }  
}  

💡 Советы по MVVM

Используйте StateFlow вместо LiveData в Kotlin (если проект не завязан на Android).
Выносите общую логику в базовый BaseViewModel.
Для корутин применяйте viewModelScope (автоматическая отмена при очистке ViewModel).


🔥 Вывод

MVVM — это стандарт для современных Android-приложений, который:
✅ Упрощает поддержку кода.
✅ Снижает связанность слоев.
✅ Работает с Jetpack Compose, Data Binding, Kotlin Flow.

Что учить дальше?

Полный стэк: .NET | AMQP | Android | api | Bash | Bootstrap | C++ | cms | Composer | css | Data | Elasticsearch | ESP32 | Git | GraphQL | Gulp | JavaScript | JetStream | Joomla | js | Kotlin | Laravel | LEMP | Linux | LMS | Markdown | MODX | Moodle | MySQL | NATS | Nginx | Node.js | OpenCart | Parsedown | PHP | Python | RabbitMQ | SCSS | SEO | Simpla | SOAP | SQL | startup | Swift | Symfony | Tailwind | Translation | Twig | Ubuntu | Unit | web3 | Webasyst | Webpack | WebSocket | WordPress | XML | Безопасность | Бизнес | блокчейн | Вёрстка | ИИ | интернет-магазин | ЛК | Руководство | ТЗ | фреймворк | Яндекс.Трекер