SwiftUI中如何将饮食图标置于VStack右侧？

问题出在哪 #

1. 你把ForEach直接放在了VStack内部，这会让每个饮食限制标签自动垂直堆叠，自然出现每行一个的效果。
2. 顶部的Spacer()只是将所有内容向下推，完全无法改变标签的排列方向，所以不起作用。

修复步骤 #

要让标签水平排列，只需把ForEach包裹在HStack中，同时调整VStack内的布局结构：

修正后的代码：

HStack {
    Image(item.thumbnailImage)
        .clipShape(Circle())
        .overlay(Circle().stroke(.gray, lineWidth: 2))
    VStack(alignment: .leading) {
        // 用HStack包裹ForEach，让标签水平排列
        HStack(spacing: 8) {
            ForEach(item.restrictions, id: \.self) { restriction in
                Text(restriction)
                    .font(.caption)
                    .fontWeight(.black)
                    .padding(5)
                    .background(colors[restriction, default: .black])
                    .clipShape(Circle())
                    .foregroundColor(.white)
            }
        }
        Text(item.name)
            .font(.headline)
        Text("$\(item.price)")
    }
}

另外注意原代码里的colors [restriction, default: .black]有语法错误，需改成colors[restriction, default: .black]（去掉空格），否则会编译报错。如果希望标签和下方文字有合适间距，可给HStack添加.padding(.bottom, 4)这类修饰符调整。

内容的提问来源于stack exchange，提问作者Seok Won Kang