SwiftUI中LoadingPlaceholderView遮挡列表行问题求助

问题核心是你当前用if-else在List内部替换了内容，导致加载时列表被完全替换。要让列表始终可见、加载视图叠加在列表上方，需要用ZStack实现层叠布局：

修改后的代码 #

var body: some View {
    VStack {
        ZStack(alignment: .center) { // 用ZStack实现层叠布局
            List {
                // 移除原if-else分支，让列表内容始终渲染
                ForEach(viewModel.posts) { post in
                    HStack(alignment: .top) {
                        displayImageView(for: post)
                            .frame(width: 100, height: 100)
                            .cornerRadius(10)

                        VStack(alignment: .leading, spacing: 4) {
                            HStack {
                                profilePictureView(for: post)
                                    .frame(width: 20, height: 20)

                                Text(post.username)
                                    .font(.system(size: 12))
                            }

                            Text(post.caption)
                                .font(.system(size: 10))
                                .lineLimit(6)
                                .truncationMode(.tail)
                        }
                    }
                    .onTapGesture {
                        self.selectedPost = post
                        self.isSheetPresented = true
                    }
                }
            }
            .onAppear {
                viewModel.checkClipboardAndUpdateContent()
                NotificationCenter.default.addObserver(
                    forName: UIApplication.willEnterForegroundNotification,
                    object: nil,
                    queue: .main
                ) { [weak viewModel] _ in
                    viewModel?.checkClipboardAndUpdateContent()
                }
            }

            // 加载视图叠加在列表上方，仅在加载状态下显示
            if viewModel.isLoading {
                LoadingPlaceholderView()
                    .frame(maxWidth: .infinity, maxHeight: .infinity)
                    .background(Color.white.opacity(0.8)) // 可选：半透明背景，既突出加载状态又保留列表可见性
            }
        }
        .sheet(isPresented: $isSheetPresented) {
            MediaPreviewSheet(post: $selectedPost)
                .presentationBackground(.ultraThinMaterial)
                .presentationDragIndicator(.visible)
                .presentationCornerRadius(20)
        }
        .onAppear {
            viewModel.isLoading = true
        }
    }
}

关键修改说明 #

• ZStack层叠布局：将列表和加载视图放入ZStack，加载视图自动叠加在列表之上，列表内容始终保持渲染状态
• 移除List内部条件分支：不再用if-else替换列表内容，确保列表全程可见
• 可选半透明背景：给LoadingPlaceholderView添加半透明背景，既能突出加载状态，又能让下方列表隐约可见（可根据需求调整透明度或直接移除）

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