首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在导航视图中为可搜索列表创建视图

在导航视图中为可搜索列表创建视图
EN

Stack Overflow用户
提问于 2022-06-18 19:55:44
回答 1查看 51关注 0票数 0

因此,我为一个包含在导航视图中的眼睛状况词汇表创建了一个可搜索的列表,它看起来/功能与我想要的完全一样。唯一的问题是,一旦您单击一个链接,它将我带到新的视图(完美),但我不知道如何编码每个项目的新视图。由于我使用了ForEach,每当我尝试创建一个视图时,它都会复制到所有的链接。我想要它的地方,一旦你点击一个链接,我将能够有眼睛条件的定义和一些额外的信息,在新的视图。如果你现在还不能说的话,我才是新手。如有任何建议,将不胜感激。以下是我的当前代码:

代码语言:javascript
复制
struct EyeTerminology: View {

let names = ["Amblyopia","Anopthalmia","Aphakia","Astigmatism","Axenfeld-Rieger Syndrome","Batten Disease","Bietti’s Crystalline Dystrophy","Bulls Eye Maculopathy","Cataract","Charles Bonnet Syndrome","Choroideremia","Coloboma","Color Blindness","Convergence Insufficiency","Corneal Scarring","Cortical Vision Impairment (CVI)","Cystinosis","Devic Disease","Diabetic Retinopathy","Diplopia","Enucleation","Esotropia","Exotropia","Floaters/Flashes","Glaucoma","Graves Disease","Heterochromia","Histoplasmosis","Hyperopia","Idiopathic Intracranial Hypertension","Keratoconus","Lebers","Macular Degeneration","Macular Edema","Microphthalmia","Myopia","Nystagmus","Ocular Albinism","Optic Atrophy","Optic Nerve Hypoplasia","Optic Neuritis","Photophobia","Polycoria","Ptosis","Retinal Detachment","Retinitis Pigmentosa","Retinoblastoma","Retinopathy of Prematurity (Stage 1)","Retinopathy of Prematurity (Stage 2)","Retinopathy of Prematurity (Stage 3)","Retinopathy of Prematurity (Stage 4)","Retinoschisis","Shaken Baby Syndrome","Stargardts","Strabismus","Toxoplasmosis","Unknown Etiology","Ushers Syndrome","Uveitis"]

    @State private var searchText = ""

    var body: some View {
        NavigationView {
            List {
                ForEach(searchResults, id: \.self) { name in
                    NavigationLink(destination: Text(name)) {
                        Text(name)
                    }
                }
            }
            .searchable(text: $searchText)
            .navigationTitle("Eye Dictionary")
        }
        .hiddenNavigationBarStyle()
    }
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-06-18 22:53:14

"...how为每个项编写新视图。“以及“.能够在新的视野中有眼睛状况的定义和一些额外的信息.”尝试下面的代码示例,其中创建了一个DetailsView,并用作NavigationLink的目标。

代码语言:javascript
复制
struct ContentView: View {
    var body: some View {
        EyeTerminology()
    }
}

struct EyeTerminology: View {
    
    let names = ["Amblyopia","Anopthalmia","Aphakia","Astigmatism","Axenfeld-Rieger Syndrome","Batten Disease","Bietti’s Crystalline Dystrophy","Bulls Eye Maculopathy","Cataract","Charles Bonnet Syndrome","Choroideremia","Coloboma","Color Blindness","Convergence Insufficiency","Corneal Scarring","Cortical Vision Impairment (CVI)","Cystinosis","Devic Disease","Diabetic Retinopathy","Diplopia","Enucleation","Esotropia","Exotropia","Floaters/Flashes","Glaucoma","Graves Disease","Heterochromia","Histoplasmosis","Hyperopia","Idiopathic Intracranial Hypertension","Keratoconus","Lebers","Macular Degeneration","Macular Edema","Microphthalmia","Myopia","Nystagmus","Ocular Albinism","Optic Atrophy","Optic Nerve Hypoplasia","Optic Neuritis","Photophobia","Polycoria","Ptosis","Retinal Detachment","Retinitis Pigmentosa","Retinoblastoma","Retinopathy of Prematurity (Stage 1)","Retinopathy of Prematurity (Stage 2)","Retinopathy of Prematurity (Stage 3)","Retinopathy of Prematurity (Stage 4)","Retinoschisis","Shaken Baby Syndrome","Stargardts","Strabismus","Toxoplasmosis","Unknown Etiology","Ushers Syndrome","Uveitis"]
    
    @State private var searchText = ""
    
    var searchResults: [String] {
        return searchText.isEmpty ? names : names.filter { $0.contains(searchText) }
    }
    
    var body: some View {
        NavigationView {
            List {
                ForEach(searchResults, id: \.self) { name in
                    NavigationLink(destination: DetailsView(name: name)) { // <-- here
                        Text(name)
                    }
                }
            }
            .searchable(text: $searchText)
            .navigationTitle("Eye Dictionary")
        }
    }
    
}

// -- here
struct DetailsView: View {
    @State var name: String  // <-- here, pass info into this view
    // @State var otherInfo: String  // <-- here etc...
    
    var body: some View {
        VStack (spacing: 33) {
            Text(name).foregroundColor(.blue)
            Text("some eye condition")
            Text("some more info on eye condition")
        }
    }
}

注意,您还可以使用@StateObject/@EnvironmentObject而不是@State将信息传递给DetailsView。有很多关于如何使用这些信息和教程。还可以查找ObservableObject

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/72672340

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档