ios - 如何使用滚动视图单击列表部分内的项目以导航到详细信息页面 SwiftUI
问题描述
有一个列表,其中有部分,每个部分包含项目,放在水平滚动视图中,当尝试使用 NavigationLink 导航到详细信息页面时,所有项目都被选中,我想选择单个项目导航到详细信息页面。这是我的代码。当我点击列表时,它会打开多次。我希望打开唯一选定的项目
let menu = Bundle.main.decode([ItemSection].self, from: "abc.json")
var body: some View {
List(menu) { sections in
VStack(alignment: .leading){
Text(sections.name)
HStack{
ScrollView(.horizontal, showsIndicators: false) {
Section {
HStack{
ForEach(sections.items){ allItems in
NavigationLink(destination: DetailView()){
ItemsTab(item: allItems)
}
}
}
}
}
}
}
}
}
struct ItemTab: View {
var items: Items
var body: some View {
VStack{
Image("name")
.resizable()
.cornerRadius(3)
.frame(width: 180, height: 180)
Text(items.name)
.foregroundColor( Color(red: 0 / 255, green: 38 / 255, blue: 107 / 255))
.font(.headline)
}
.padding(.top)
.padding(.bottom)
.padding(.leading, 5)
.padding(.trailing,5)
}
解决方案
我已经在本地复制了您的代码,我相信您NavigationView
从列表视图中错过了。请务必将列表包装成NavigationView
这样:
NavigationView { // <-- Be sure to add this
List(menu) { sections in
VStack {
/*...*/
}
}
}
推荐阅读
- python - 熊猫数据框到所需的python字典
- twitter-bootstrap - 无法正确定位引导复选框
- windows - Win_service "无法在计算机 '.' 上启动服务 InstallerService。"
- javascript - 为什么没有浅大小或保留大小的节点被列为分离节点?
- android - 有没有办法从“CMD+SHIFT+O”(转到文件)搜索结果中过滤掉 ButterKnife ViewBinding 文件?
- python - 关于 autocorrelation_plot 结果与 autocorr 结果的问题
- java - Facebook 广告未显示已使用 Facebook 帐户登录
- microsoft-graph-api - Microsoft-Graph 在 webhook 订阅上使用 $filter
- csv - Flink Data Stream CSV Writer 未将数据写入 CSV 文件
- scala - 创建部分应用函数时缺少扩展函数的参数类型