SwiftUI中每个元素自动生成TabView问题求助

问题根源 #

你遇到的问题并非TabView或tabItem写法导致，而是子视图的body违反了SwiftUI的核心规则：SwiftUI要求每个View的body必须返回单个视图元素。当你在FirstView和SecondView的body中直接并列多个视图（比如两个Text、Text加Gauge）时，SwiftUI会隐式生成TupleView，但在TabView的层级上下文里，这个结构被错误解析为多个独立的Tab项，最终导致每个子元素都变成了单独的Tab页。

修复代码 #

只需给每个子视图的多个元素添加容器视图（比如VStack、HStack，根据布局需求选择），确保body返回单个视图：

import SwiftUI

struct MainTabView: View {
    var body: some View {
        TabView {
            
            FirstView()
                .tabItem(Label("Text", systemImage: "doc.text"))
            
            SecondView()
                .tabItem{Label("Gauge", systemImage: "gauge") }
        }
    }
}

struct FirstView: View {
    var body: some View {
        VStack(spacing: 20) {
            Text("Seite 1")
            Text("Zeile 1")
        }
    }
}

struct SecondView: View {
    var body: some View {
        VStack(spacing: 20) {
            Text("Gauge")
            Gauge(value: 50, in: 0...100) { Text("Messung") }
        }
    }
}

#Preview {
    MainTabView()
}

关键修复说明 #

• 使用VStack（垂直布局）包裹子视图中的多个元素，你也可以根据需求换成HStack（水平布局）或ZStack（层叠布局），核心是确保body只返回一个视图容器。
• 原代码中TabView的写法完全正确，两种tabItem的写法（链式调用和闭包形式）没有任何差异，之前的误解是因为没有定位到视图结构的核心问题。

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