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

SwiftUI中如何在TextEditor多行文本里检测换行(回车)?

在SwiftUI中接收TextEditor多行输入并检测回车键按下

一、基础:接收多行字符串

直接用@State或@Binding绑定TextEditor的text属性,就能实时获取用户输入的所有多行内容(包括换行符):

struct ContentView: View {
    @State private var inputText = ""
    
    var body: some View {
        TextEditor(text: $inputText)
            .padding()
            .border(.gray)
    }
}

二、检测用户按下回车键(两种实用方案)

方案1:自定义TextEditor(精准捕获按键动作)

通过包装原生UITextView并实现代理方法,能精准区分用户按下回车键的动作,不受粘贴内容里的换行干扰:

  1. 创建自定义组件:
struct CustomTextEditor: UIViewRepresentable {
    @Binding var text: String
    var onReturnPressed: () -> Void
    
    func makeUIView(context: Context) -> UITextView {
        let textView = UITextView()
        textView.delegate = context.coordinator
        textView.font = UIFont.systemFont(ofSize: 16)
        return textView
    }
    
    func updateUIView(_ uiView: UITextView, context: Context) {
        if uiView.text != text {
            uiView.text = text
        }
    }
    
    func makeCoordinator() -> Coordinator {
        Coordinator(self)
    }
    
    class Coordinator: NSObject, UITextViewDelegate {
        var parent: CustomTextEditor
        
        init(_ parent: CustomTextEditor) {
            self.parent = parent
        }
        
        func textView(_ textView: UITextView, shouldChangeTextIn range: NSRange, replacementText text: String) -> Bool {
            // 检测到回车键按下
            if text == "\n" {
                parent.onReturnPressed()
                // 允许插入换行符(若不需要换行可返回false)
                return true
            }
            return true
        }
    }
}
  1. 在视图中使用:
struct ContentView: View {
    @State private var inputText = ""
    @State private var returnTapCount = 0
    
    var body: some View {
        VStack {
            CustomTextEditor(text: $inputText) {
                returnTapCount += 1
                print("用户按下回车键,累计次数:\(returnTapCount)")
            }
            .padding()
            .border(.gray)
            
            Text("回车键按下次数:\(returnTapCount)")
                .padding()
        }
    }
}

方案2:onChange监听字符串变化(简单场景适用)

如果不需要区分按键和粘贴的换行,可通过对比文本变化来判断新增换行:

struct ContentView: View {
    @State private var inputText = ""
    @State private var lastText = ""
    
    var body: some View {
        TextEditor(text: $inputText)
            .padding()
            .border(.gray)
            .onChange(of: inputText) { newText in
                let newLineCount = newText.components(separatedBy: "\n").count - lastText.components(separatedBy: "\n").count
                if newLineCount > 0 {
                    print("新增了\(newLineCount)个换行")
                }
                lastText = newText
            }
    }
}

注意:此方法无法区分换行是来自按键还是粘贴,仅适合无需精准判断触发源的场景。

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

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.08.15 17:35:33