Question

我正在尝试创建“可扩展菜单”。

到目前为止，我已经创建了一个“ menuArray”，其中包含标题列表以及子标题数组。

struct menuStruct: Identifiable {
    var id: Int
    var text: String
    var isExpanded: Bool
    var subItems: [subMenuStruct]?
}

struct subMenuStruct {
    var text: String
    var selected: Bool
    var link: pagesEnum
}

当用户点击该行时，我正在切换menuArray.isExpanded值。

我遇到的问题是，当点击该行时，不会更新UI。打印语句显示该数组已正确更改，但由于某种原因未在列表中反映出来。

最初，我将数组作为“状态”对象保存，但读取到元素内值的更改不视为更改，因此应使用可观察对象。这似乎没有帮助。

为什么更改的值不反映在UI中？

谢谢！

class MenuViewModel: ObservableObject {
    @Published var menuArray: [menuStruct] = [menuStruct(id: 1, text: "SMS", isExpanded: false, subItems: [subMenuStruct(text: "Stats", selected: false, link: .smsStats),subMenuStruct(text: "Customers", selected: false, link: .smsCustomers),subMenuStruct(text: "Activity", selected: false, link: .smsActivity),subMenuStruct(text: "Customer Care", selected: false, link: .smsCutomerCare),subMenuStruct(text: "Keywords", selected: false, link: .smsKeywords)]),menuStruct(id: 2, text: "Online Chat", isExpanded: false, subItems: [subMenuStruct(text: "Stats", selected: false, link: .ocStats),subMenuStruct(text: "Customers", selected: false, link: .ocCustomers),subMenuStruct(text: "Activity", selected: false, link: .ocActivity)]),menuStruct(id: 3, text: "Console", isExpanded: true, subItems: [subMenuStruct(text: "Queues", selected: false, link: .queues)]),menuStruct(id: 4, text: "Support", isExpanded: false, subItems: [subMenuStruct(text: "Contact Admin", selected: false, link: .support)])]

}

struct Menu: View {

    @ObservedObject var menuVM = MenuViewModel()
    @EnvironmentObject var settings: UserSettings

    var body: some View {

        GeometryReader { geo in

            VStack(spacing: 0){

                Spacer().frame(height: geo.safeAreaInsets.top)

                HStack(spacing:0){
                    Text("AllStar.").font(.custom("Poppins-Bold", size: 39))

                    Spacer()
                    Image("Cross").resizable().frame(width:20, height: 20).onTapGesture {
                        self.settings.menuShowing = false
                    }
                }.padding(.horizontal,20)

                HStack(spacing:0){

                    Text("Chat").font(.custom("Poppins-Bold", size: 39)).foregroundColor(Color.init("Pink"))
                    Spacer()

                }.padding(.leading,20)


                ScrollView{

                    HStack{
                        Text("Dashboard").font(.custom("Poppins-Bold", size: 24))
                        Spacer()
                    }.padding(.top,10).padding(.horizontal,20)

                    ForEach (self.menuVM.menuArray.indices){ index in

                        HStack(spacing:0){

                            Text(self.menuVM.menuArray[index].text).font(.custom("Poppins-Bold", size: 24))

                            if(self.menuVM.menuArray[index].subItems != nil){

                                Image("downArrow").resizable().frame(width:40,height:15)
                            }

                            Spacer()
                        }.onTapGesture {

                            // Tapping the row will cause it to expand
                            self.menuVM.menuArray[index].isExpanded.toggle()
                            self.menuVM.objectWillChange.send()
                            print(String.init(describing: self.menuVM.menuArray))
                        }

                        if self.menuVM.menuArray[index].isExpanded  {
                            Text("Expanded!")
                        }

                    }.padding(.horizontal,20)
                }

                Spacer()
            }.background(Color.white).edgesIgnoringSafeArea(.all)
        }
    }
}

Answer 1

这是我使事情正常进行的工作。将结构更改为类，因为您必须更改它们中的值，而结构不允许这样做。这是视图未更新的原因之一。

class menuStruct: Identifiable {
var id: Int
var text: String
var isExpanded: Bool
var subItems: [subMenuStruct]?

init(id: Int, text: String, isExpanded: Bool, subItems: [subMenuStruct]?) {
    self.id = id
    self.text = text
    self.isExpanded = isExpanded
    self.subItems = subItems
}
}

class subMenuStruct {
var text: String
var selected: Bool
var link: pagesEnum

init(text: String, selected: Bool, link: pagesEnum) {
    self.text = text
    self.selected = selected
    self.link = link
}
}

我还将ScrollView更改为：

            ScrollView{
                HStack{
                    Text("Dashboard").font(.custom("Poppins-Bold", size: 24))
                    Spacer()
                }.padding(.top,10).padding(.horizontal,20)
                ForEach (self.menuVM.menuArray){ menu in
                    HStack(spacing:0){
                        Text(menu.text).font(.custom("Poppins-Bold", size: 24))
                        if(menu.subItems != nil){
                            Image("downArrow").resizable().frame(width:40,height:15)
                        }
                        Spacer()
                    }.onTapGesture {
                        // Tapping the row will cause it to expand
                        menu.isExpanded.toggle()
                        self.menuVM.objectWillChange.send()
                        print(String.init(describing: self.menuVM.menuArray))
                    }
                    if menu.isExpanded {
                        Text(" \(menu.text)  is Expanded")
                    }
                }.padding(.horizontal,20)
            }

SwiftUI列表未在可观察对象更改时更新

1 个答案: