如何在 SwiftUI 中正确使用 NavigationLink

Question

这里是全新的编码器，也是第一次使用。如果这对大多数人来说太容易了，我深表歉意。我在使用 naviationLink 从上下文视图切换到详细视图时遇到问题。我想展示一排吉他，然后展示从 table.

中选择的吉他的细节视图

这里有一些细节。我有一个包含吉他列表的 Guitars.swift 文件。（见下文）

import Foundation

struct Guitars: Identifiable, Hashable {
    let id: Int
    let name, description, imageName: String
    }

 let guitar: [Guitars] = [
     .init (id: 1, name: "Classical", description: "This is a nylon string guitar that is acoustic and made if cedar or spruce wood", imageName: "classical"),
     .init (id: 2, name: "Acoustic", description: "The acoustic guitar is a steel string instrument that is traditionally played as an accompanying part of a musical performance.", imageName: "acoustic"),
     .init (id: 3, name: "Electric", description: "This is a steel string guitar that is electic with pickups and made to be played through amplifiers", imageName: "electric_guitar-1"),
     .init (id: 4, name: "Banjo", description: "This is a steel string guitar that has five strings.  It's usually played in country and bluegrass music", imageName: "banjo"),
     .init (id: 5, name: "Bass", description: "This is a steel string guitar that has four strings.  It's usually played in all types of bands and provides the bass line for the music", imageName: "bass")

 ]

我有一个包含已定义属性和结构的 guitarDetails 文件。（见下文）

struct GuitarDetails: View {

    var selectedGuitar: Guitars

    var body: some View {
        VStack{
            Image(selectedGuitar.name)
            .resizable()
            .frame(width:300, height: 300)
            VStack {
                Spacer()

            }
        }
    }
}

struct GuitarDetails_Previews: PreviewProvider {
    static var previews: some View {
        GuitarDetails(selectedGuitar: <#T##Guitars#>)

最后，我有一个 ContentView 文件，我在其中创建了 NavigationLink 以从内容视图移动到详细信息视图，但我无法让它工作。有人可以帮我吗？这是内容查看代码。

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView {
            List (Guitars) { guitar in
                NavigationLink(destination: GuitarDetails(selectedGuitar: guitar) {
           }
         }
       }
      }
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
  }
 }
}

我得到的错误是：“'GuitarDetails.Type' 不可转换为‘(Guitars) -> GuitarDetails’

Answer 1

您需要传递 guitar 数组，而不是 List 中的 Guitars 类型。这就是您收到该错误的原因。

虽然你的命名不好，但你对单数项使用复数，对复数项使用单数。这可能会导致混淆，最好对您所描述的内容使用适当的术语。

例如，您的 Guitars 结构只描述了一把吉他，因此它应该重命名为 Guitar。类似地，吉他数组被命名为 guitar 这没有意义，因为它是一个吉他数组，所以它实际上应该是复数并且被命名为 guitars.

理想情况下你应该有这样的东西；请注意，我使用了更合适的命名约定。

struct Guitar: Identifiable, Hashable {
    let id: Int
    let name, description, imageName: String
}

// defining guitars like this, outside of a class or struct, makes it a global variable.
let guitars: [Guitar] = [
     .init (id: 1, name: "Classical", description: "This is a nylon string guitar that is acoustic and made if cedar or spruce wood", imageName: "classical"),
     .init (id: 2, name: "Acoustic", description: "The acoustic guitar is a steel string instrument that is traditionally played as an accompanying part of a musical performance.", imageName: "acoustic"),
     .init (id: 3, name: "Electric", description: "This is a steel string guitar that is electic with pickups and made to be played through amplifiers", imageName: "electric_guitar-1"),
     .init (id: 4, name: "Banjo", description: "This is a steel string guitar that has five strings.  It's usually played in country and bluegrass music", imageName: "banjo"),
     .init (id: 5, name: "Bass", description: "This is a steel string guitar that has four strings.  It's usually played in all types of bands and provides the bass line for the music", imageName: "bass")
]

那么你的 GuitarDetail 应该类似于：

struct GuitarDetail: View {

    var selectedGuitar: Guitar // notice it is no longer plural, as that didn't make sense

    var body: some View {
        VStack{
            Image(selectedGuitar.imageName) // make sure you use the image name
            .resizable()
            .frame(width:300, height: 300)
            VStack {
                Spacer()

            }
        }
    }
}

最后是你的 ContentView

struct ContentView: View {
    var body: some View {
        NavigationView {
            // as you have defined guitars above as a global variable you should be able to access it like this
            List (guitars) { guitar in
                NavigationLink(destination: GuitarDetail(selectedGuitar: guitar) {
                    Text(guitar.name) // you need something inside your NavigationLink for it to work
           }
        }
    }
}

如何在 SwiftUI 中正确使用 NavigationLink

How do I use the NavigationLink Properly with SwiftUI

navigation

swift

swiftui