CRUD operations with SwiftData in iOS Swift - UI Render Trace

Component - CRUD operations with SwiftData

This UI component demonstrates basic CRUD (Create, Read, Update, Delete) operations using SwiftData in an iOS app. It shows a list of items that the user can add to, edit, or remove, with changes saved automatically.

Widget Tree

NavigationView
└── List
    ├── ForEach (items)
    │   └── HStack
    │       ├── Text (item.name)
    │       ├── Spacer
    │       └── Button (Delete)
    └── Toolbar
        └── Button (Add)

The root is a NavigationView that provides a navigation bar. Inside it, a List displays all items fetched from SwiftData. Each item is shown in a horizontal stack with its name and a delete button. The toolbar contains an Add button to create new items.

Render Trace - 5 Steps

Step 1: NavigationView

Step 2: List

Step 3: ForEach

Step 4: Button (Add)

Step 5: Button (Delete)

State Change - Re-render

Trigger:User taps Add button

Before

List shows current items

→

After

A new item is created and added to the list, UI updates to show it

Re-renders:The List and its ForEach rows re-render to include the new item

UI Quiz - 3 Questions

What happens when the Add button is tapped?

A The app closes

B A new item is created and shown in the list

C The list is cleared

D Nothing happens

Key Insight

Using SwiftData with SwiftUI allows automatic UI updates when data changes. The List and ForEach widgets react to data changes, so adding or deleting items instantly refreshes the visible list without manual UI code.

Practice

1. What does the @Model attribute in SwiftData represent?

easy

A. A UI component for displaying lists

B. A data model class used to define entities for CRUD operations

C. A function to fetch data from the network

D. A SwiftUI view modifier for styling

Solution

1. Step 1: Understand the role of @Model

   The @Model attribute marks a class as a data model entity for SwiftData, enabling CRUD operations.

2. Step 2: Differentiate from UI and functions

   It is not related to UI components, network functions, or view modifiers.

3. Final Answer:

   A data model class used to define entities for CRUD operations -> Option B

4. Quick Check:

   @Model defines data entities = B [OK]

Hint: Remember @Model marks data classes, not UI or functions [OK]

Common Mistakes:

• Confusing @Model with UI components
• Thinking @Model fetches data
• Mixing @Model with view modifiers

2. Which of the following is the correct way to declare a SwiftData model class named Book with a title property of type String?

easy

A. @Model class Book { var title: String }

B. @Model struct Book { var title: String }

C. struct Book { var title: String }

D. class Book: ObservableObject { var title: String }

Solution

1. Step 1: Identify correct @Model usage

   SwiftData requires @Model on a class, not a struct, to define a data entity.

2. Step 2: Check class vs struct and attribute

   @Model class Book { var title: String } correctly uses @Model with a class and a property.

3. Final Answer:

   @Model class Book { var title: String } -> Option A

4. Quick Check:

   @Model + class + properties = D [OK]

Hint: Use @Model with class, not struct, for SwiftData models [OK]

Common Mistakes:

• Using struct instead of class for @Model
• Omitting @Model attribute
• Using ObservableObject instead of @Model

3. Given the following SwiftData code snippet, what will be the output when printing books.count after adding a new book?

struct ContentView: View {
  @Environment(\"modelContext\") private var modelContext
  @Query var books: [Book]

  var body: some View {
    Button(\"Add Book\") {
      let newBook = Book(title: \"SwiftData Basics\")
      modelContext.insert(newBook)
    }
    Text(\"Books count: \(books.count)\")
  }
}

medium

A. Books count: 0

B. Books count: 2

C. Books count: 1

D. Compilation error

Solution

1. Step 1: Understand @Query and modelContext.insert

   The @Query property fetches all Book entities. Inserting a new Book updates the data source.

2. Step 2: Check the effect of insertion on books.count

   After inserting one new Book, the count increases by 1, so it will be 1.

3. Final Answer:

   Books count: 1 -> Option C

4. Quick Check:

   Insert one book, count updates to 1 [OK]

Hint: Inserting updates @Query results immediately [OK]

Common Mistakes:

• Assuming count stays 0 after insert
• Expecting count to be 2 without adding twice
• Thinking code causes compile error

4. Identify the error in this SwiftData update code snippet:

func updateBookTitle(book: Book, newTitle: String) {
  book.title = newTitle
  modelContext.save()
}

medium

A. No error; code updates title correctly

B. Missing call to modelContext.insert(book)

C. book.title cannot be changed directly; must create new Book

D. modelContext.save() is not a valid method in SwiftData

Solution

1. Step 1: Check SwiftData update pattern

   In SwiftData, changes to model object properties are tracked automatically, but modelContext.save() is not a valid method to persist changes explicitly.

2. Step 2: Identify if there's an error

   Directly mutating book.title is correct, but calling modelContext.save() causes an error because the method does not exist.

3. Final Answer:

   modelContext.save() is not a valid method in SwiftData -> Option D

4. Quick Check:

   Property change tracked automatically; no save() method = A [OK]

Hint: SwiftData tracks changes automatically; no save() method needed [OK]

Common Mistakes:

• Thinking modelContext.save() exists
• Believing properties are immutable
• Confusing update with insert

5. You want to delete all Book objects with an empty title using SwiftData. Which code snippet correctly performs this operation?

hard

A. books.filter { $0.title.isEmpty }.forEach { modelContext.delete($0) }

B. for book in books where book.title.isEmpty { modelContext.delete(book) }

C. modelContext.deleteAll(Book.self, where: \"title == ''\")

D. modelContext.remove(books.filter { $0.title.isEmpty })

Solution

1. Step 1: Understand deletion in SwiftData

   To delete objects, you call modelContext.delete(object) for each object.

2. Step 2: Check each option for correctness

   books.filter { $0.title.isEmpty }.forEach { modelContext.delete($0) } filters books with empty titles and deletes each correctly. for book in books where book.title.isEmpty { modelContext.delete(book) } syntax is invalid in Swift. modelContext.deleteAll(Book.self, where: \"title == ''\") uses a non-existent method. modelContext.remove(books.filter { $0.title.isEmpty }) uses wrong method name.

3. Final Answer:

   books.filter { $0.title.isEmpty }.forEach { modelContext.delete($0) } -> Option A

4. Quick Check:

   Filter then delete each = A [OK]

Hint: Filter then delete each object individually [OK]

Common Mistakes:

• Using invalid for-in with where clause
• Calling non-existent deleteAll method
• Using wrong method name like remove