SwiftUI：如何为TextField实现持续显示的删除线效果？

直接给TextField添加.strikethrough()修饰符无效，因为系统默认的TextField控件会忽略这个文本样式修饰符。以下是两种纯SwiftUI实现方案：

方案一：ZStack叠加文本实现（纯SwiftUI） #

通过将透明的TextField和带删除线的Text叠加，让Text显示删除线效果，TextField负责处理输入交互：

@State var textFieldText: String = ""

var body: some View {
    ZStack(alignment: .leading) {
        // 透明TextField负责接收输入
        TextField("", text: $textFieldText)
            .opacity(0)
            .padding(.leading, 8)
        
        // 带删除线的Text同步展示输入内容
        Text(textFieldText)
            .strikethrough()
            .padding(.leading, 8)
            .allowsHitTesting(false) // 允许点击穿透到下方TextField
    }
    // 添加占位提示文本
    .overlay(
        Text("some_prompt")
            .foregroundColor(.secondary)
            .opacity(textFieldText.isEmpty ? 1 : 0)
            .padding(.leading, 8)
    )
    .padding()
}

方案二：AttributedString结合叠加层（iOS 16+） #

利用AttributedString设置删除线样式，通过叠加层同步显示输入内容：

@State var textFieldText: String = ""

var body: some View {
    TextField("some_prompt", text: $textFieldText)
        .font(.body)
        .overlay(
            Text(AttributedString(textFieldText).strikethrough())
                .padding(.leading, 8)
                .allowsHitTesting(false)
                .opacity(textFieldText.isEmpty ? 0 : 1)
        )
        .padding()
}

内容的提问来源于stack exchange，提问作者Vêx