You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

在SwiftUI中如何仅当用户做出选择后才激活NavigationLink?

SwiftUI 控制NavigationLink激活状态的解决方案

你只需要新增一个判断是否有选中项的计算属性,再给NavigationLink添加禁用状态控制即可,修改后的完整代码如下:

import SwiftUI

struct AudienceView: View {
    
    @State var isOn_w = false
    @State var isOn_m = false
    @State var isOn_g = false
    @State var isOn_b = false
    
    // 新增:判断是否至少选中一个选项
    private var hasValidSelection: Bool {
        isOn_w || isOn_m || isOn_g || isOn_b
    }
    
    var body: some View {
        
        VStack {
            Text("Audience")
                .fontWeight(.bold)
                .font(.title2)
                .frame(
                      minWidth: 0,
                      maxWidth: .infinity,
                      alignment: .center
                    )
            
            Spacer()
            
            ScrollView{
                Toggle(isOn: $isOn_w) {
                    Text("Women")
                        .WithDefaultButtonTextFormatting()
                }
                .WithDefaultToggleSelectedFormatting()
                                    
                Toggle(isOn: $isOn_m) {
                    Text("Men")
                        .WithDefaultButtonTextFormatting()
                }
                .WithDefaultToggleSelectedFormatting()
                    
                Toggle(isOn: $isOn_g) {
                    Text("Girls")
                        .WithDefaultButtonTextFormatting()
                }
                .WithDefaultToggleSelectedFormatting()
                    
                Toggle(isOn: $isOn_b) {
                    Text("Boys")
                        .WithDefaultButtonTextFormatting()
                }
                .WithDefaultToggleSelectedFormatting()
            }
            NavigationLink(destination: AgeCategoryView(), label: {Text("Next")})
                // 未选中时禁用按钮
                .disabled(!hasValidSelection)
                // 未选中时降低透明度,实现不高亮效果
                .opacity(hasValidSelection ? 1 : 0.4)
                .padding(.bottom)
        }
        
    }
}

如果需要支持单选模式,你可以把多个Bool类型的状态变量替换为单个可选类型变量,存储当前选中的唯一值,判断该值不为空时即可激活NavigationLink。

内容的提问来源于stack exchange,提问作者Carryn W. Kerr

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.04 01:21:00