SwiftUI：来自可重用视图的计算属性不起作用

Question

使用 SwiftUI 框架，我创建了这个可重用的视图（减去了花里胡哨的样式）：

struct RatingView: View {
    let criteria: String
    @State var rating: Int
    
    var body: some View {
        HStack {
            Button {
                if rating > 0 {
                    rating -= 1
                }
            } label: {
                Image(systemName: "heart.slash.fill")
            }
            
            Spacer()
            
            Text("\(criteria): \(rating)")

            Spacer()
            
            Button {
                if rating < 1 {
                    rating += 1
                }
            } label: {
                Image(systemName: "heart.fill")
            }
        }
    }
}

并在这里实施（同样，没有花里胡哨的造型）：

struct ScoringView: View {
    let story = "Story"
    let cheese = "Cheese"
    let love = "Romance"
    let actor = "In character"
    
    var storyRating = 0
    var cheesyRating = 0
    var loveRating = 0
    var actorRating = 0
    
    var roundScore: Int {
        storyRating + cheesyRating + loveRating + actorRating
    }
    
    var body: some View {                 
        VStack {
            RatingView(criteria: story, rating: storyRating)
            RatingView(criteria: cheese, rating: cheesyRating)
            RatingView(criteria: love, rating: loveRating)
            RatingView(criteria: actor, rating: actorRating)
        }
                
        Spacer()
                
        VStack {
            Text("Score this round:")
            Text("\(roundScore)")
        }
    }
}

无论我对评级按钮进行何种更改， roundScore计算属性都不会更改并保持为零。

我在 Playground 中测试了计算属性，它可以工作，但是因为我无法在 SO 上找到任何关于计算属性和可重用视图组合的信息。 所以我想知道可重用视图是否让我感到困惑。

有什么想法吗？

Answer 1

你需要一些东西触发View更新或 SwiftUI 不知道何时重绘。

添加@State

@State var storyRating = 0
@State var cheesyRating = 0
@State var loveRating = 0
@State var actorRating = 0

并将其从RatingView中删除

@Binding var rating: Int

@State是真实来源， @Binding是双向连接。

您还必须在初始化视图时添加$

RatingView(criteria: story, rating: $storyRating)
RatingView(criteria: cheese, rating: $cheesyRating)
RatingView(criteria: love, rating: $loveRating)
RatingView(criteria: actor, rating: $actorRating)