@可观察的模型更改未反映在视图中

时间:2019-10-04 10:54:35

标签: ios swift swiftui

以下是我的示例实现,用于测试SwiftUI中的function addCross() { let myNodeList = document.getElementsByTagName('li'); for (let i = 0; i < myNodeList.length; i++) { let span = document.createElement('span'); let cross = document.createTextNode('\u00D7'); span.className = 'close' span.appendChild(cross); if (myNodeList[i]) myNodeList[i].appendChild(span); } } addCross(); //--------------------------------------------- let close = document.getElementsByClassName('close'); for (let i = 0; i < close.length; i++) { close[i].addEventListener('click', function() { let cross = close[i].parentElement; cross.style.display = 'none'; }); } //----------------------------------------------- function addItem() { let ul = document.getElementById('list'); let inputText = document.getElementById('inputText').value; let li = document.createElement('li'); let textNode = document.createTextNode(inputText) let span = document.createElement('span'); let cross = document.createTextNode('\u00D7'); span.className = 'close' span.appendChild(cross); li.appendChild(textNode); li.appendChild(span); if (inputText === '') { alert('enter some task, please') } else { ul.appendChild(li); } } ``` 功能。它包含简单的列表视图和详细信息视图。

我们可以将对象添加到列表中(它们会反映在视图中)。我们可以转到详细信息查看并编辑名称,描述。但是,这些更改未反映在上一个屏幕(列表)中。

这是不正确的方法还是应该仅使用@Observable变量来获得所需的结果?

@EnvirnomentObject

详细视图:

import SwiftUI

struct ContentView: View {
    @ObservedObject var model: ModelOne
    var body: some View {
        NavigationView{
            List(){
                ForEach(model.items,id: \.id){
                    item in
                    NavigationLink(destination: DetailView(item: item)){
                        VStack(alignment: .leading){
                            Text(item.name).lineLimit(1)
                            Text(item.description).lineLimit(1)
                        }.onAppear {
                            print("\(item.name)")
                        }
                    }
                }
            }.navigationBarTitle("List", displayMode: .inline)
                .navigationBarItems(trailing: AddItem(buttonAction: {
                    let newItem = Items()
                    newItem.name = "Empty"
                    newItem.description = "Empty"
                    self.model.items.append(newItem)
                }))
        }
    }
}

struct AddItem: View {
    var buttonAction: (()->Void)
    var body: some View{
        Button(action: {
            self.buttonAction()
        }){
            Text("Add")
        }
    }
}

class ModelOne: ObservableObject{
    @Published var items: [Items] = []
}

class Items: Identifiable{
    var id: UUID = UUID()
    var name: String = ""
    var description: String = ""
}

2 个答案:

答案 0 :(得分:0)

还没有时间进行测试,但是我认为您的“数组”类型没有改变,因此不会触发发布者。另外,您在详细视图中观察到一个项目,但是将更改发布到“数组”上,我认为这行不通。

尝试将观察到的模型传递给详细视图,并为特定项目传递一个附加参数。

答案 1 :(得分:0)

body中的

ContentView正在观察model-它不在观察行内的项目,因此对特定Items的更新不会触发更新bodyContentView中的第一个。

解决此问题的最简单方法是将行移至其自己的struct,该行用于观察项目。这样,当项目更改时,行中的视图将被更新:

struct ContentView: View {
    @ObservedObject var model: ModelOne
    var body: some View {
        NavigationView{
            List(){
                ForEach(model.items,id: \.id){
                    item in
                    NavigationLink(destination: DetailView(item: item)){
                        Row(item:item)
                    }
                }
            }.navigationBarTitle("List", displayMode: .inline)
                .navigationBarItems(trailing: AddItem(buttonAction: {
                    let newItem = Items()
                    newItem.name = "Empty"
                    newItem.description = "Empty"
                    self.model.items.append(newItem)
                }))
        }
    }
}

struct Row: View {

    @ObservedObject var item: Items

    var body: some View {
        NavigationLink(destination: DetailView(item: item)){
            VStack(alignment: .leading){
                Text(item.name).lineLimit(1)
                Text(item.description).lineLimit(1)
            }.onAppear {
                print("\(self.item.name)")  
            }
        }
    }

}