Refreshing a SwiftUI List

nOk picture nOk · Aug 30, 2019 · Viewed 10.4k times · Source

Ím trying to refresh this List whenever I click on a NavLink

NavigationView {
    List(feed.items.indices, id:\.self) { i in
        NavigationLink(destination: ListFeedItemDetail(idx: i).environmentObject(self.feed)) {
            ListFeedItem(item: self.$feed.items[i])
        }
    }
}

The list is made out of an array inside an environment object. The problem: It does only refresh when I switch to another tab or close the app I had used a modal View before and it worked there. (I did it with .onAppear) Any Ideas?

Example

Problem: When you tap on an item in the list and tap the toggle button the EnvironmentObject is changed but this changed is only reflected when I change the tab and change it back again

import SwiftUI
import Combine

struct TestView: View {

    @State var showSheet: Bool = false
    @EnvironmentObject var feed: TestObject
    func addObjects() {
        var strings = ["one","two","three","four","five","six"]
        for s in strings {
            var testItem = TestItem(text: s)
            self.feed.items.append(testItem)
        }
    }

    var body: some View {
        TabView {
            NavigationView {
                List(feed.items.indices, id:\.self) { i in
                    NavigationLink(destination: detailView(feed: self._feed, i: i)) {
                        HStack {
                            Text(self.feed.items[i].text)
                            Text("(\(self.feed.items[i].read.description))")
                        }
                    }
                }
            }
                .tabItem({ Text("Test") })
                .tag(0)

            Text("Blank")
                .tabItem({ Text("Test") })
                .tag(0)
        }.onAppear {
            self.addObjects()
        }
    }
}

struct detailView: View {
    @EnvironmentObject var feed: TestObject
    var i: Int
    var body: some View {
        VStack {
            Text(feed.items[i].text)
            Text(feed.items[i].read.description)
            Button(action: {  self.feed.items[self.i].isRead.toggle() }) {
                Text("Toggle read")
            }
        }
    }
}

final class TestItem: ObservableObject {
    init(text: String) {
        self.text = text
        self.isRead = false
    }
    static func == (lhs: TestItem, rhs: TestItem) -> Bool {
        lhs.text < rhs.text
    }
    var text: String
    var isRead: Bool

    let willChange = PassthroughSubject<TestItem, Never>()
    var read: Bool {
        set {
            self.isRead = newValue
        }
        get {
            self.isRead
        }
    }
}

class TestObject: ObservableObject {
    var willChange = PassthroughSubject<TestObject, Never>()

    @Published var items: [TestItem] = [] {
        didSet {
            willChange.send(self)
        }
    }
}

Answer

workingdog picture workingdog · Aug 31, 2019

I had a similar problem, this is the hack I came up with.

In your "TestView" declare:

@State var needRefresh: Bool = false

Pass this to your "detailView" destination, such as:

NavigationLink(destination: detailView(feed: self._feed, i: i, needRefresh: self.$needRefresh)) {
     HStack {
            Text(self.feed.items[i].text)
            Text("(\(self.feed.items[i].read.description))")
     }.accentColor(self.needRefresh ? .white : .black)
 }

Note ".accentColor(self.needRefresh ? .white : .black)" to force a refresh when "needRefresh" is changed.

In your "detailView" destination add:

@Binding var needRefresh: Bool

Then in your "detailView" in your Button action, add:

self.needRefresh.toggle()