連接組件之間的SwiftUI互動-有解無憂

我正在嘗試連接兩個組件：

@State private var buttonState = ButtonState.DISABLED
@State private var emailAddressChangedValue = ""

VStack {
    TextEdit(editText: $viewModel.email, changedValue: $emailAddressChangedValue, placeholder: NSLocalizedString("onboarding.forgotpassword.email.label", comment: ""), keyboardType: UIKeyboardType.emailAddress)
            .padding(.top, 4)

    Button(action: {
        viewModel.sendPasswordResetRequest()
    }, label: {
            Text(NSLocalizedString("onboarding.forgotpassword.sendemail.label", comment:""))
            .padding()
            .font(.headline)
            .foregroundColor(Color.white)
    })
    .buttonStyle(FooButtonStyle(buttonState: $buttonState))
    .disabled(!validateEmail(emailAddress: emailAddressChangedValue))
    .padding(.top, 8)
    .padding(.horizontal, 8)
}

因此，一個人輸入他們的電子郵件地址，并在他們鍵入時emailAddressChangedValue發出鍵入的文本。電子郵件地址通過驗證validateEmail(emailAddress: emailAddressChangedValue)，一旦出現有效的電子郵件地址，按鈕就會啟用。但是，我無法弄清楚如何將$buttonState顏色樣式從禁用更改為啟用。我嘗試將它放在validateEmail函式中，但是當我這樣做時，我收到一個錯誤Modifying state during view update, this will cause undefined behavior.

那么，如何buttonState在 VStack 中更新呢？

uj5u.com熱心網友回復：

假設TextEdit是TextField或TextEditor，您可以嘗試.onReceive{}像下面的示例代碼一樣添加到“...更新 VStack 中的 buttonState”。（注意，你需要import Combine）：

VStack {
    TextEdit(editText: $viewModel.email, changedValue: $emailAddressChangedValue, placeholder: NSLocalizedString("onboarding.forgotpassword.email.label", comment: ""), keyboardType: UIKeyboardType.emailAddress)
        .padding(.top, 4)
    
    Button(action: {
        viewModel.sendPasswordResetRequest()
    }, label: {
        Text(NSLocalizedString("onboarding.forgotpassword.sendemail.label", comment:""))
            .padding()
            .font(.headline)
            .foregroundColor(Color.red)
    })
    // -- here --
    .onReceive(Just(emailAddressChangedValue)) { val in
       buttonState = !validateEmail(emailAddress: val)
    }
    .buttonStyle(FooButtonStyle(buttonState: $buttonState))
    .disabled(buttonState) // <-- could also be here 
    .padding(.top, 8)
    .padding(.horizontal, 8)
}

轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/452932.html

標籤：迅速迅捷

上一篇：在SwiftUI中從側面影片視圖

下一篇：如何在表格視圖單元格中添加紅點徽章？