现在在NavigationView / NagivationLink

Question

我试图在NavigationView / NagivationLink容器中显示多个可点击的图像。

    var body: some View {
    NavigationView {
        VStack {
            ForEach(self.sets) { set in
                NavigationLink(destination: ExerciseVideoView(items: set.items )) {
                    Image("group-\(set.purpose)")
                        .resizable()
                        .frame(height: 300, alignment: .leading)
                }
            }
        }
    }
}

但是没有显示图像。

当我删除NavigationView和NagivationLink行时-除了使图像当然可以单击之外，一切都进行得很好。这是显示图像时屏幕的外观：

这是当我取消注释NavigationView和NagivationLink行时发生的情况：

您能否解释一下为什么我在使用NagivationLink时没有显示它们？

谢谢！

Answer 1

NavigationLink默认将图像解释为 template 渲染模式，因此您必须明确指定

NavigationLink(destination: ExerciseVideoView(items: set.items )) {
    Image("group-\(set.purpose)")
        .resizable()
        .renderingMode(.original)                 // << here !!
        .frame(height: 300, alignment: .leading)
}