ObservableObject & MVVM Architecture

စိတ်လျှော့ပါ။ ဒီခန်းကို စာအုပ်လိုမဟုတ်ဘဲ စကားပြောသလိုပဲ၊ နားလည်လွယ်အောင် ရှင်းပါမယ်။

ဒီခန်းပြီးရင် ဘာတတ်သွားမလဲ

ObservableObject & MVVM Architecture ကို ကြောက်စရာမလိုအောင် နားလည်မယ်
ကိုယ်တိုင် Xcode/SwiftUI code ကို run ကြည့်တတ်မယ်
Real project ထဲမှာ ဒီ concept ကို ချက်ချင်း အသုံးချတတ်မယ်

ခဏလေး ဒီလိုပဲ စဉ်းစားကြည့်

MVVM (Model-View-ViewModel) က UI (View) ကို business logic (ViewModel) ကနေ ခွဲထုတ်ထားတဲ့ architecture pattern ပါ — Model က data (database, API), View က UI (SwiftUI View), ViewModel က ၂ ခုကြားက middleman ပါ။ `ObservableObject` protocol ကို conform လုပ်ထားတဲ့ class မှာ `@Published` property ကို ထည့်ရင် — value ပြောင်းတိုင်း, ဒီ ViewModel ကို `@ObservedObject`/`@StateObject` နဲ့ observe လုပ်ထားတဲ့ View အားလုံးကို automatic re-render ပေးပါတယ် (`@State` ရဲ့ View-local scope ထက် ပိုကျယ်ပြန့်ပါတယ်).

လက်တွေ့ scenario နဲ့ ချိတ်ကြည့်မယ်

`class TodoViewModel: ObservableObject { @Published var todos: [TodoItem] = []; func addTodo(title: String) { todos.append(TodoItem(title: title)) } }` လို့ ရေးထားရင် — View ထဲမှာ `@StateObject private var viewModel = TodoViewModel()` နဲ့ instance ကို ရယူပြီး, `viewModel.todos` ကို `List` ထဲမှာ display လုပ်နိုင်ပါတယ် — button tap ရင် `viewModel.addTodo(...)` ခေါ်ရုံပါပဲ, UI code ထဲမှာ business logic ရောစပ်စရာ မလိုတော့ပါ.

MVVM = Model (data) / View (UI) / ViewModel (logic middleman) ခွဲထားသော architecture
ObservableObject + @Published = value ပြောင်းရင် observing View အားလုံးကို automatic re-render
@StateObject (View က ပိုင်ဆိုင်သော instance) vs @ObservedObject (parent ကနေ ရရှိသော instance)

အတူတူ ကြည့်မယ်

swift

class TodoViewModel: ObservableObject {
    @Published var todos: [TodoItem] = []

    func addTodo(title: String) {
        todos.append(TodoItem(title: title))
    }
}

struct TodoScreen: View {
    @StateObject private var viewModel = TodoViewModel()

    var body: some View {
        List(viewModel.todos) { todo in
            Text(todo.title)
        }
    }
}

You should see

`viewModel.addTodo(title: "Buy milk")` ခေါ်ရင် List ထဲမှာ item အသစ် automatic ပေါ်လာတာ တွေ့ရမည်။

၅ မိနစ် စမ်းကြည့်

`TodoViewModel` ကို ကိုယ်တိုင်ရေးပြီး, todo item ၂-၃ ခု `addTodo()` နဲ့ ထည့်ကြည့်ပါ — `TodoScreen` ကို run ပြီး List ထဲမှာ automatic ပေါ်လာကြောင်း confirm လုပ်ကြည့်ပါ။

သတိလေးတစ်ချက်

`@Published` property ကို UI thread မဟုတ်တဲ့ background thread ကနေ update လုပ်ရင် crash/undefined behavior ဖြစ်နိုင်ပါတယ် — `@MainActor` ကို ViewModel class ပေါ် annotate ထားရန် (ဒါမှမဟုတ် `DispatchQueue.main.async` ကို သုံးရန်) လိုအပ်ပါတယ်။

ဒီနေရာမှာ လူအများမှားတတ်တယ်

`@StateObject` သုံးရမယ့်နေရာမှာ `@ObservedObject` ကို သုံးမိခြင်း — View ကို re-create တိုင်း ViewModel instance အသစ် ပြန်ဖန်တီးသွားပြီး state ပျောက်နိုင်ပါတယ် (View ကိုယ်ပိုင်ဆိုင်တဲ့ instance ကတော့ `@StateObject` သုံးရမယ်)
Business logic (data fetch, transform) ကို View struct ထဲမှာ တိုက်ရိုက် ရေးနေခြင်း — testing/reusability ခက်ခဲသွားပါတယ်

အခု ကိုယ်တိုင် စမ်းကြည့်

You'll know it worked when: `viewModel.addTodo(title: "Buy milk")` ခေါ်ရင် List ထဲမှာ item အသစ် automatic ပေါ်လာတာ တွေ့ရမည်။