SwiftUI中如何将ForEach内的筛选标签分布到3行显示？

要把横向滚动的标签改成3行无需滚动的布局，直接用SwiftUI的LazyVGrid替换原来的ScrollView+HStack即可，具体修改如下：

// 定义网格布局规则：自适应宽度，最小宽度80（可根据标签内容调整）
let gridItems = [GridItem(.adaptive(minimum: 80))]

// 替换原有的横向ScrollView部分
LazyVGrid(columns: gridItems, spacing: 12) {
    ForEach(tagData, id: \.self) { tag in
        Button {
            print("Tag Tapped...")
        } label: {
            BusinessFilterTag(filterSelected: $filterSelected, businessTagData: tag )
        }
        .background(
            Capsule()
                .stroke(Color("AshGray"), lineWidth: 2)
                .padding(4)
                .background(
                    Capsule()
                        .fill(selection == tag.id ? Color("LightBlue").opacity(0.6) : Color.clear)
                        .padding(4)
                )
        )
    }
}
// 设置容器最大高度，确保刚好容纳3行（根据标签实际高度调整数值）
.frame(maxHeight: 150)
// 可选：若标签数量超出3行，隐藏超出部分
.clipped()

关键说明： #

• GridItem(.adaptive(minimum: 80))：让标签根据自身宽度自适应排列，填满一行后自动换行，minimum值可根据标签内容长度调整，避免文字截断。
• spacing：控制标签间的水平/垂直间距，按需调整。
• frame(maxHeight:)：限制容器高度，保证3行标签完全展示，无需滚动。可根据BusinessFilterTag的实际高度计算该值（比如每行高度40，3行加间距约150）。

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