LazyGrid项onTap手势触发sheet异常：selectedFollower始终为nil

我正在学习理解@State属性，暂不考虑ViewModel，尝试通过sheet修饰符在点击LazyGrid任意项时模态展示视图。但展示的始终是空视图，原因是selectedFollower始终为nil。

现有代码片段 #

状态属性定义 #

@State private var selectedFollower : Follower? = nil
@State var showFollowerDetail = false

LazyGrid中的项展示代码 #

ForEach(followers, id: \.self) { follower in
      GridCells(follower: follower)
           .onTapGesture {
                  selectedFollower = follower
                  showFollowerDetail = true
           }
}

sheet修饰符代码 #

.sheet(isPresented: $showFollowerDetail, content: {
      if let selectedFollower{
            UserInfoView(follower: selectedFollower)
      }
})

解决方法 #

问题出在isPresented绑定sheet的方式上，这种方式容易因视图状态同步问题，导致sheet内部无法正确捕获selectedFollower的最新值。改用item绑定的sheet就能直接解决：

1. 移除多余的showFollowerDetail状态，只保留selectedFollower：

@State private var selectedFollower: Follower? = nil

2. 修改LazyGrid的点击事件，仅设置selectedFollower：

ForEach(followers, id: \.self) { follower in
    GridCells(follower: follower)
        .onTapGesture {
            selectedFollower = follower
        }
}

3. 替换sheet修饰符为item绑定版本：

.sheet(item: $selectedFollower) { selectedFollower in
    UserInfoView(follower: selectedFollower)
}

补充说明 #

如果Follower类型未遵循Identifiable协议，需在sheet的item参数中指定id：

.sheet(item: $selectedFollower, id: \.self) { selectedFollower in
    UserInfoView(follower: selectedFollower)
}

item绑定的sheet会在selectedFollower非nil时自动弹出，闭包内可直接拿到非nil对象，彻底避免状态不同步导致的nil问题。

内容的提问来源于stack exchange，提问作者mshrestha