Читайте и производите вычисления с вводом текстового поля SwiftUI

Question

Я хочу сделать расчеты с входными данными из 2 различных текстовых полей и поместить вывод в текст. См. Код:

@State var input1: String = ""

@State var input2: String = ""

var calculation : Double {
    let calculationProduct = Double(input1) * Double(input2)
    return calculationProduct
}

var body: some View {
VStack{
 TextField("", text: $input1)
 TextField("", text: $input1)

Text("\(calculation)")
}

Проблема в том, что код не компилируется, я получаю разные ошибки компиляции, например: «Двоичный оператор '*» не может быть применен к двум «Double?» операнды ".

Что идет не так?

Answer 1

Double(input1) возвращает String?, потому что это не гарантирует работу. Например, Double("1abc")

Мы можем использовать guard let или if let или даже оператор слияния nil ??, чтобы справиться с этим. Но для следующего примера мы будем изящно обрабатывать его, используя guard let.

struct ContentView: View {
    @State var input1: String = ""
    @State var input2: String = ""

    var calculation : Double {
        guard let m = Double(input1), let n  = Double(input2) else { return 0 }
        return m * n
    }

    var body: some View {
        VStack {
            TextField("", text: $input1)
            TextField("", text: $input2)

            Text("\(calculation)")
        }
    }
}

---

РЕДАКТИРОВАТЬ

Согласно вашим комментариям, есть несколько способов показать «Ошибка» на недействительном входные данные или ответ до 2 десятичных знаков.
Для этого примера давайте изменим result на вычисленное свойство String в обоих этих случаях, например:

struct ContentView: View {
    @State var input1: String = ""
    @State var input2: String = ""

    var calculation: String {
        //check if both fields have text else no need for message
        guard input1.isEmpty == false, input2.isEmpty == false else { return "" }

        //check if both are numbers else we need to print "Error"
        guard let m = Double(input1), let n  = Double(input2) else { return "Error" }

        let product = m * n
        return String(format: "%.2f", product)
    }

    var body: some View {
        VStack {
            TextField("Enter First Number", text: $input1)
                .textFieldStyle(RoundedBorderTextFieldStyle())
            TextField("Enter Second Number", text: $input2)
                .textFieldStyle(RoundedBorderTextFieldStyle())

            Text(calculation)
        }
    }
}

PS: Если если вы хотите, чтобы вводились только цифры, подумайте о применении модификатора .keyboardType(.decimalPad) к TextField s.