SwiftUIの基本を身につけたい方はこちら

【SwiftUI】プレースホルダーにメールアドレスを入れると、青色になってしまう事象の解決方法

事象

以下のように、プレースホルダーにメールアドレスを入れると、

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
struct ContentView: View {
@State private var emailText = ""
var body: some View {
TextField("sample@example.com", text: $emailText)
}
}
struct ContentView: View { @State private var emailText = "" var body: some View { TextField("sample@example.com", text: $emailText) } }
struct ContentView: View {
    @State private var emailText = ""

    var body: some View {
        TextField("sample@example.com", text: $emailText)
    }
}

このように、青色になってしまいます。

SwiftUIのバグ?みたいな感じに思える仕様ですね。

解決方法

①”sample@example.com”を定数に入れてから参照する形にする。

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
struct ContentView: View {
@State private var emailText = ""
private let emailPlaceholder = "sample@example.com"
var body: some View {
TextField(emailPlaceholder, text: $emailText)
}
}
struct ContentView: View { @State private var emailText = "" private let emailPlaceholder = "sample@example.com" var body: some View { TextField(emailPlaceholder, text: $emailText) } }
struct ContentView: View {
    @State private var emailText = ""
    private let emailPlaceholder = "sample@example.com"

    var body: some View {
        TextField(emailPlaceholder, text: $emailText)
    }
}

②値だったら良いので、\()で囲う

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
TextField("\("sample@example.com")", text: $emailText)
TextField("\("sample@example.com")", text: $emailText)
TextField("\("sample@example.com")", text: $emailText)

UIViewRepresentableで、CustomTextFieldを作る。これだと自由自在にいじれますね。

評価