SwiftUI-将常见元素移动到自己的视图中将停止更新渲染

Question

当您切换元素时，我在List（）中有一个带有8个可切换选项的屏幕，它将对象属性正确设置为true或false，因此我想将该页面中的代码从每个元素的7行代码减少到1行

从

Toggle(isOn: $viewRouter.flags.obj1) {
    Text("Option1")
    .foregroundColor(viewRouter.flags.obj1 ? COLOR_BLACK : COLOR_WHITE)
}.padding()
.background(viewRouter.flags.obj1 ? COLOR_LIGHT_GREEN : COLOR_LIGHT_RED)
.cornerRadius(30.0)

Toggle(isOn: $viewRouter.flags.obj2) {
    Text("Option2")
    .foregroundColor(viewRouter.flags.obj2 ? COLOR_BLACK : COLOR_WHITE)
}.padding()
.background(viewRouter.flags.obj2 ? COLOR_LIGHT_GREEN : COLOR_LIGHT_RED)
.cornerRadius(30.0)

TO

ToggleElement(isOn: $viewRouter.flags.obj1, text: "Object1")
ToggleElement(isOn: $viewRouter.flags.obj2, text: "Object2")

使用以下代码

import SwiftUI

struct ToggleElement: View {
    @Binding var isOn: Bool
    var text: String = "test"

    var body: some View {
        Toggle(isOn: self.$isOn) {
            Text(verbatim: self.text)
            .foregroundColor(isOn ? COLOR_BLACK : COLOR_WHITE)
        }
        .padding()
        .background(isOn ? COLOR_LIGHT_GREEN : COLOR_LIGHT_RED)
        .cornerRadius(30.0)
    }

}

struct ToggleElement_Previews: PreviewProvider {
    @State static var previewIsOn: Bool = true
    static var previews: some View {
        ToggleElement(isOn: self.$previewIsOn, text: "buttonText")
    }
}

但是背景颜色不再随切换而改变。

对象viewRouter.flags.obj1和viewRouter.flags.obj2对我来说正在改变状态

标志对象是

import Foundation
import SwiftUI
import Combine

class FlagObject: ObservableObject {
    @Published var obj1:Bool = false
    @Published var obj2:Bool = false    
}