首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

SwiftUI:如果在ForEach中使用,NavigationLink会立即弹出

SwiftUI是一种用于创建跨平台用户界面的声明式的框架,主要用于开发iOS、iPadOS、macOS、watchOS和tvOS应用程序。SwiftUI引入了一种全新的UI编程范式,与传统的基于视图层次结构的编程方式相比,SwiftUI更加简洁、直观且易于维护。

在SwiftUI中,ForEach是一个用于循环遍历数组或集合,并根据每个元素生成视图的结构。而NavigationLink是一种用于在导航栈中推送新视图的控件。当在ForEach中使用NavigationLink时,通常会遇到立即弹出的问题。

这是因为SwiftUI在渲染视图时,会立即创建和显示导航链接的视图,而不是在用户点击时再推送新视图。这意味着无论用户是否点击导航链接,都会立即显示相关的导航视图。

要解决这个问题,可以通过将ForEach的数据源与NavigationLink的目标视图延迟绑定来实现。具体做法是将ForEach中的数据源和NavigationLink的目标视图封装到一个闭包中,并在用户点击导航链接时才触发闭包中的逻辑,从而推送新视图。

以下是一个示例代码:

代码语言:txt
复制
struct ContentView: View {
    let items = ["Item 1", "Item 2", "Item 3"]
    @State private var selectedItem: String? = nil
    
    var body: some View {
        NavigationView {
            List {
                ForEach(items, id: \.self) { item in
                    Button(action: {
                        selectedItem = item
                    }) {
                        Text(item)
                    }
                }
            }
            .navigation(item: $selectedItem) { selectedItem in
                Text("Selected: \(selectedItem)")
            }
            .navigationBarTitle("Items")
        }
    }
}

在这个示例中,我们使用了一个List来展示数据源中的每个元素,并通过ForEach循环生成了多个Button。当用户点击某个Button时,会设置selectedItem为对应的item,并触发NavigationLink中的闭包来推送新视图。

值得注意的是,为了使NavigationView正常工作,我们还需要将导航链接放在NavigationView中,并使用navigation(item:destination:)方法来实现推送新视图的功能。

推荐的腾讯云相关产品:由于限制不能提及具体品牌商,请您自行参考腾讯云相关产品,例如云服务器、对象存储、云数据库等,以满足您的云计算需求。您可以通过腾讯云官网了解更多腾讯云产品和服务:腾讯云官网

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

解析 SwiftUI 两处由状态更新滞后引发的严重 Bug

众所周知,SwiftUI 是一个响应式框架,这意味着,当数据源发生变化时,框架自动更新视图。同样,当我们想调整视图显示时,应直接对状态进行修改。...原文发表在我的博客 肘子的Swift记事本视图变化在前、状态变化在后在 SwiftUI ,某些可编程控件在执行一定的操作时,先更新视图,待视图变化完成后再修改与其对应的状态。...通过手势取消 Sheet 后,快速右滑导航容器导致应用锁死这是一个在 SwiftUI 所有版本存在的错误,你可以在众多的论坛或聊天室里看到不少的开发者都在寻找解决方法。...),立即在屏幕上由左至右滑动,返回上一层视图在滑动返回到上一层视图后,应用锁死。...在我们遇到问题的两个场景,应用程序都恰好使用了导航容器,并且通过特定的操作,使 RunLoop 处于了适合 AG 打包更新的状态。

711110

如何让 SwiftUI 的列表变得更加灵活

SwiftUI 初版的概念和 API 编写的,下面让我们尝试使用新功能来为我们的列表实现自定义样式,并且使代码更加健壮。...使用新速记语法 让我们从一个很小的特性开始,这是一个非常受欢迎的变化,可以使用类似 enum 的速记语法来引用 SwiftUI 附带的任何内置 ListStyle 类型。...为了演示这种情况,我们在 List 嵌套一个 ForEach (因为在 SwiftUI,列表变化一版都是由 ForEach 触发的,而不是由 List 触发的)。...由于每个 article 值在 ForEach 闭包中都是可变的,我们可以使用新的 swipeActions 修饰符来实现每个 NavigationLink 项目视图的自定义滑动操作。...中使用,请查看昨天的这篇文章[1],不要错过真正重要的“在 Swift 认识 async/await[2]”WWDC 会议。

4.9K41
  • SwiftUI 4.0 的全新导航系统

    ⚠️ 在使用堆栈管理系统的情况下,请不要在编程式导航混用声明式导航,这样破坏当前的视图堆栈数据 下面的代码,如果点击声明式导航,将导致堆栈数据重置。...) // 使用编程式的 NavigationLink } } } image-20220611104123815 由于 SwiftUI 4.0 为 List 提供了进一步的加强...("ID: \(i)", value: i) } } } SwiftUI 4.0 ,在 List 绑定了数据后,通过 List 构造方法创建的循环或 ForEach 创建的循环中的内容...4.0 之前的版本上使用类似的功能,可以参考我在 用 NavigationViewKit 增强 SwiftUI 的导航视图[4] 一文的实现方法 其他增强 除了上述的功能, 新的导航系统还在很多其他的地方也进行了增强...样式 在之前版本的 SwiftUI NavigationLink 其实一直都是作为一种特殊的 Button 存在的。

    10.3K62

    解析 SwiftUI 两处由状态更新滞后引发的严重 Bug

    众所周知,SwiftUI 是一个响应式框架,这意味着,当数据源发生变化时,框架自动更新视图。同样,当我们想调整视图显示时,应直接对状态进行修改。...视图变化在前、状态变化在后 在 SwiftUI ,某些可编程控件在执行一定的操作时,先更新视图,待视图变化完成后再修改与其对应的状态。这些控件基本上都是对 UIkit(AppKit)的二次包装。...通过手势取消 Sheet 后,快速右滑导航容器导致应用锁死 这是一个在 SwiftUI 所有版本存在的错误,你可以在众多的论坛或聊天室里看到不少的开发者都在寻找解决方法。...(动画结束时),立即在屏幕上由左至右滑动,返回上一层视图 在滑动返回到上一层视图后,应用锁死。...在我们遇到问题的两个场景,应用程序都恰好使用了导航容器,并且通过特定的操作,使 RunLoop 处于了适合 AG 打包更新的状态。

    34820

    SwiftUI 与 Core Data —— 安全地响应数据

    本文将介绍可能在视图中产生严重错误的原因,如何避免,以及在保证视图对数据变化实时响应的前提下如何为使用者提供更好、更准确的信息。由于本文涉及大量前文中介绍的技巧和方法,因此最好一并阅读。...可能开发者会有这样的疑问,假如某个实体的属性在模型中被定义为可选,且在托管对象的类型声明也为可选值类型( 例如上方的 timestamp 属性 ),那么如果在可以保证 save 时一定有值的情况下,是否可以在使用使用...回到 Xcode 创建的 Core Data 模版代码,我们做如下的尝试,在进入 NavigationLink 后一秒钟删除该数据:ForEach(items) { item in NavigationLink....now, formatter: itemFormatter)")如果使用我们在 SwiftUI 与 Core Data —— 数据定义[7] 一文讨论的 ConvertibleValueObservableObject...但在非常多的情况下,开发者并不会使用演示中使用NavigationLink 版本,为了对视图拥有更强地控制力,开发者通常会选择具备可编程特性的 NavigationLink 版本。

    3.3K20

    优化在 SwiftUI List 显示大数据集的响应效率

    SwiftUI 为视图设置显式标识目前有两种方式: 在 ForEach 的构造方法中指定 由于 ForEach 的视图数量是动态的且是在运行时生成的,因此需要在 ForEach 的构造方法中指定可用来标识子视图的...使用了 id 修饰符相当于将这些视图从 ForEach 拆分出来,因此丧失了优化条件。 总之,当前在数据量较大的情况下,应避免在 List ForEach 的子视图使用 id 修饰符。...由于 id 修饰符并非惰性修饰符( Inert modifier ),因此我们无法在 ForEach 仅为列表的头尾数据使用 id 修饰符。...生产中的处理方式 本文为了演示 id 修饰符在 ForEach 的异常状况以及问题排查思路,创建了一个在生产环境几乎不可能使用的范例。...如果在正式开发面对需要在 List 中使用大量数据的情况,我们或许可以考虑下述的几种解决思路( 以数据采用 Core Data 存储为例 ): 数据分页 将数据分割成若干页面是处理大数据集的常用方法,

    9.2K20

    用NavigationViewKit增强SwiftUI的导航视图

    由于SwiftUI原生提供的导航手段能力有限,因此在之前的版本,NavigationView总是使用的不是那么的顺手。...该扩展遵循以下几个原则: •非破坏性任何新添加的功能都不能影响当前SwiftUI提供的原生功能,尤其是不能影响例如Toolbar、NavigationLink在NavigationView的表现•尽可能便于使用仅需极少的代码便可使用新增功能...目前常用的解决方案有两种: •重新包装UINavigationController好的包装确实可以使用到UINavigationController提供的众多功能,不过非常容易同SwiftUI的原生方法相冲突...,鱼和熊掌不可兼得•使用程序化的NavigationLink通过撤销根视图的程序化的NavigationLink(通常是isActive)来返回。...此种手段将限制NavigationLink的种类选择,另外不利于从非视图代码实现。

    3.2K20

    架构之路 (五) —— VIPER架构模式(一)

    开始 首先看下主要内容: 在本教程,您将了解如何在SwiftUI和Combine中使用VIPER体系结构模式,同时构建一个允许用户创建公路旅行的iOS应用程序,来自翻译。...在此过程,您还将了解您的iOS项目中的SwiftUI和Combine。 打开启动项目。这包括一些代码,让你开始: 当你构建其他视图时,ContentView启动它们。...最后,在TripListView,在ForEach的结束括号后面添加以下内容: .onDelete(perform: presenter.deleteTrip) 将. ondelete添加到SwiftUI...) .frame(height: 240) } 它使用来自presenter的NavigationLink,将单元格设置为其内容并将其放入列表。...使用presenter向列表添加新路径点的add按钮。 一个列表List,它使用ForEach与presenter为每个路点创建一个单元格。

    17.5K10

    如何使用 SwiftUI 构建 visionOS 应用

    苹果表示,构建应用程序的最佳方式是使用 Swift 和 SwiftUI。下面,我们将学习如何使用 SwiftUI 构建 visionOS 应用程序。...Windows我喜欢 SwiftUI 的一点是它如何自动适应平台。你无需执行任何操作即可在 visionOS 上运行使用 SwiftUI 编写的应用程序。它可以即插即用。...visionOS 的装饰是位于窗口外部的位置,用于呈现与窗口连接的控件。你还可以通过使用新的 ornament 视图修改器手动创建它们。...例如,RealityKit 为我们提供了 Model3D SwiftUI 视图,允许我们从 USDZ 或实际文件显示 3D 模型。...体积样式允许你的内容在第三维增长,以匹配模型的大小。对于更复杂的 3D 场景,我们可以使用 RealityView 并填充它以 3D 内容。

    18521

    WWDC 23 之后的 SwiftUI 有哪些新功能

    前言 WWDC 23 已经到来,SwiftUI 框架中有很多改变和新增的功能。在本文中将主要介绍 SwiftUI 数据流、动画、ScrollView、搜索、新手势等功能的新变化。...数据流 Swift 5.9 引入了宏功能,成为 SwiftUI 数据流的核心。SwiftUI 不再使用 Combine,而是使用新的 Observation 框架。...也不再需要 @Published 属性包装器,因为 SwiftUI 视图自动跟踪任何可观察类型的可用属性的更改。...在之前的 SwiftUI 框架版本,应该使用 @ObservedObject 属性包装器来订阅更改。现在不需要了,因为 SwiftUI 视图自动跟踪符合 Observable 协议的类型的更改。...动画 动画始终是 SwiftUI 框架中最重要的部分。在 SwiftUI 轻松实现任何动画,但之前的框架版本缺少一些现在具有的功能。

    38520

    SwiftUI 创建自适应的程序化导航方案

    与 UIKit 使用的命令式导航方式不同,SwiftUI 作为一个声明式框架,感知与设置两者之间是二位一体的关系。读取状态即可获知当前的导航位置,更改状态便可调整导航路径。...因此在 SwiftUI ,掌握两种导航容器的状态表述差异是实现自适应导航方案的关键。...使用数组( NavigationPath 也是对 Hashable 数组的一种包装 )作为状态的表现形式。在栈推送和弹出数据的过程对应了导航容器添加和移除视图的操作。...弹出全部数据相当于返回根视图,推送多个数据相当于一次性添加多个视图并直接跳转到最后数据所代表的视图。...为了避免使用者产生误解,代码中分别使用了两个 id 修饰器在状态变化后对列视图进行了刷新。

    4.3K30

    Ask Apple 2022 与 SwiftUI 有关的问答(下)

    在两种方案如果在数据量很大的情况下,我更倾向于第一种方式,这样可以按需求读取数据。...navigationDestination,这样侧边栏里的 NavigationLink 就会取代详细栏的根视图。...连锁动画Q:在 SwiftUI ,如何实现连锁动画?例如,我想先给一个视图做动画,当动画完成后立即启动另一个动画。A:不幸的是,目前不可能实现连锁动画。...在 SwiftUI 早期版本,当在 iOS 中使用系统中文输入法时,很容易触发这种情况。但后期逐步得到了修复。近期,在聊天室我也看到了类似的讨论( 我本人尚未在 iOS 16 上遇到 )。...但这个滚动有两大问题,1、是一个未公开的半成品,有可能会被从 SwiftUI 框架移除;2、不支持懒加载,即使和 Lazy 视图一起使用一次性加载全部的视图。

    14.8K30

    @StateObject 研究

    SwiftUI 1.0时代,如果想将引用类型作为source of truth,通常的方法是使用@EnvironmentObject或者 @ObservedObject。...为了能够让开发者更好的掌控代码,同时也保持对于上一版本良好的兼容性,苹果在SwiftUI2.0添加了@StateObject。顾名思义,它是@State的引用类型版本。...当再次进入link后,@StateObject对应的视图中计数清零(由于返回父视图,再次进入时会重新创建视图,所以重新创建实例),不过@ObservedObject对应的视图中计数是不清零的。...我个人还是更推荐将来都使用@StateObject来消除代码运行的不确定性。 通过下述代码,使用@StateObject同样可以得到测试2ObservedObject的运行效果。...在下一篇文章《SwiftUI2.0 —— 100% SwiftUI app》,我们来进一步探讨。

    1.2K40

    SwiftUI-数据流

    SwiftUI的界面是严格数据驱动的:运行时界面的修改,只能通过修改数据来间接完成,而不是直接对界面进行修改操作。...数据处理的基本原则 Data Access as a Dependency:在 SwiftUI 数据一旦被使用就会成为视图的依赖,也就是说当数据发生变化了,视图展示也跟随变化,不会像 MVC 模式下那样要不停的同步数据和视图之间的状态变化...5.1 的新特性 Property Wrapper来实现的一种属性装饰语法糖(修饰器/装饰器) Property 这种形式最简单,就是在 View定义常量或者变量,然后在内部使用 import SwiftUI...使用@EnvironmentObject,SwiftUI立即在环境搜索正确类型的对象。如果找不到这样的对象,则应用程序将立即崩溃。...数据流图 从上图可以看出SwiftUI 的数据流转过程: 用户对界面进行操作,产生一个操作行为 action 该行为触发数据状态的改变 数据状态的变化触发视图重绘 SwiftUI 内部按需更新视图,

    10.2K20

    从用SwiftUI搭建项目说起

    我们在后面遇到的一些问题也回到这个官方文档进行一些验证。...标签(TabBar)+ 导航(Na)形式的模式是随处可见的,我们这次的目的是利用SwiftUI搭建这样一个场景构建一个基本的应用,包括登录和数据处理以及iOS常见控件在SwiftUI的一些具体的使用,...View ---- 我自己觉得,要想从UIKit转换到SwiftUI,需要我们最先转变的概念就是 Controller -> View 的一个改变,在使用SiwftUI写UI的过程,基本上是不在需要我们向...@State变量使用的,具体的我们会在后面的代码说的,关于这个@State我在项目Demo中有具体的解释,包括像@bind类型或者是@EnvironmentObject这些关键字我们肯定是得需要学习的...当 @State 装饰过的属性发生了变化,SwiftUI 根据新的属性值重新创建视图 */ @State private var selectedTab = 0 var

    4.5K20
    领券