首页 > 解决方案 > VStack 中的 NavigationLink 在 iPad 上已损坏

问题描述

考虑这个非常简单的视图:只有几个指向其他页面的链接。如果你在 iPhone 上运行它,一切都会按预期运行。但是,在 iPad 上横向运行它,您会注意到大多数时候链接根本不起作用。在sim和真机上都破了,这让人吃惊。

当您将 更改VStack为 aList时,一切都会突然正常。

struct ContentView: View {
  var body: some View {
    NavigationView {
      VStack {
        NavigationLink(destination: Text("Link 1")) {
          Text("Link 1")
            .padding(.vertical)
        }

        NavigationLink(destination: Text("Link 2")) {
          Text("Link 2")
            .padding(.vertical)
        }

        NavigationLink(destination: Text("Link 3")) {
          Text("Link 3")
            .padding(.vertical)
        }

        NavigationLink(destination: Text("Link 4")) {
          Text("Link 4")
            .padding(.vertical)
        }
        NavigationLink(destination: Text("Link 5")) {
          Text("Link 5")
            .padding(.vertical)
        }
      }

      Text("Hello iPad")
    }
  }
}

有没有其他人遇到过这个问题?为什么会发生,解决方法是什么?除了明显的“使用列表”:p 我使用VStacks 和HStacks 的网格来显示多列中的链接,可根据设备大小进行配置。因此,如果不是 100% 必要,更改为 aList将不是可取的。

标签: swiftui

解决方案


我建议您在尝试找到一些“解决方法”之前阅读文档

 // Creates an instance that presents `destination` when `selection` is set
 // to `tag`.
    public init<V>(destination: Destination, tag: V, selection: Binding<V?>, @ViewBuilder label: () -> Label) where V : Hashable

示例用法

struct ContentView: View {
    @State var selection: Int? = 0
    var body: some View {
        NavigationView {
            VStack {
                NavigationLink(destination: Text("Link 0"), tag: 0, selection: $selection) {
                    Text("link 0")
                }
                NavigationLink(destination: Text("Link 1"), tag: 1, selection: $selection) {
                    Text("link 1")
                }
                NavigationLink(destination: Text("Link 2"), tag: 2, selection: $selection) {
                    Text("link 2")
                }

            }

            Text("Hello iPad user, swipe from left to continue ...")
        }
    }
}

推荐阅读