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

使用@FocusState与.onSubmit时出现键盘弹跳问题求助

问题:@FocusState切换焦点时键盘弹跳现象

我正尝试在应用中实现@FocusState优化登录流程,代码功能正常,但每次触发.onSubmit时都会出现键盘弹跳现象,不清楚是操作有误还是存在Bug。

复现代码

struct FocusedFieldTest: View {
    enum FocusedField {
        case username, password, email
    }
    
    @FocusState private var focusedField: FocusedField?
    
    @State private var email = ""
    @State private var username = ""
    @State private var password = ""
    
    var body: some View {
        NavigationStack {
            Form {
                TextField("Enter your email", text: $email)
                    .focused($focusedField, equals: .email)
                    .submitLabel(.continue)
                
                TextField("Enter your username", text: $username)
                    .focused($focusedField, equals: .username)
                    .submitLabel(.continue)
                
                SecureField("Enter your password", text: $password)
                    .focused($focusedField, equals: .password)
                    .submitLabel(.done)
            }
            .onSubmit {
                switch focusedField {
                case .email:
                    focusedField = .username
                case .username:
                    focusedField = .password
                default:
                    focusedField = nil
                }
            }
            .navigationTitle("Test")
        }
    }
}

现象展示

键盘弹跳现象


问题原因

在Form上统一绑定.onSubmit时,触发提交动作后系统会先让当前输入框失去焦点(导致键盘短暂收起),再设置新的焦点(键盘重新弹出),这一过程产生了视觉上的弹跳效果。

修复方案

移除Form上的统一.onSubmit,给每个输入框单独绑定提交动作,直接切换焦点,避免焦点的短暂丢失:

struct FocusedFieldTest: View {
    enum FocusedField {
        case username, password, email
    }
    
    @FocusState private var focusedField: FocusedField?
    
    @State private var email = ""
    @State private var username = ""
    @State private var password = ""
    
    var body: some View {
        NavigationStack {
            Form {
                TextField("Enter your email", text: $email)
                    .focused($focusedField, equals: .email)
                    .submitLabel(.continue)
                    .onSubmit {
                        focusedField = .username
                    }
                
                TextField("Enter your username", text: $username)
                    .focused($focusedField, equals: .username)
                    .submitLabel(.continue)
                    .onSubmit {
                        focusedField = .password
                    }
                
                SecureField("Enter your password", text: $password)
                    .focused($focusedField, equals: .password)
                    .submitLabel(.done)
                    .onSubmit {
                        focusedField = nil
                    }
            }
            .navigationTitle("Test")
        }
    }
}

这种方式让每个输入框的提交动作直接关联焦点切换,不会触发Form层面的默认提交逻辑,从而消除键盘弹跳问题。


内容的提问来源于stack exchange,提问作者Gaspare

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.08.16 06:50:22