SwiftUI中如何在详情页获取NavigationView内Rosette的指定数据

首先确保导航到详情页时，已将UserProfileResponse实例正确传递过去，以下是完整实现步骤：

1. 导航传递数据 #

在触发导航的页面（比如列表页），通过NavigationLink将UserProfileResponse实例传递给详情页：

struct ProfileListPage: View {
    // 示例初始化UserProfileResponse实例
    let userProfile = UserProfileResponse(
        userName: "testUser",
        level: 5,
        photo: "",
        followerCount: 100,
        followCount: 80,
        name: "Test Name",
        title: "Athlete",
        bio: "Hello World",
        height: 180,
        weight: 75,
        dateOfBirth: 1000000000,
        rosette: CircleLevelList.four,
        activities: [],
        docId: "123"
    )
    
    var body: some View {
        NavigationStack { // iOS16+用NavigationStack，旧版本替换为NavigationView
            NavigationLink(destination: ProfileDetailPage(userProfile: userProfile)) {
                Text("进入个人详情页")
            }
        }
    }
}

2. 详情页接收并访问Rosette数据 #

详情页接收UserProfileResponse参数后，可根据需求访问rosette数组中的数据：

场景1：访问单个Rosette的字段 #

如果需要获取数组中特定位置的Rosette（比如第一个），用可选绑定避免空数组崩溃：

struct ProfileDetailPage: View {
    let userProfile: UserProfileResponse
    
    var body: some View {
        VStack(spacing: 20) {
            Text("用户名：\(userProfile.userName)")
            
            if let firstRosette = userProfile.rosette.first {
                Text("首个徽章等级：\(firstRosette.rosetteLevel)")
                Text("已完成进度：\(firstRosette.rosetteDone)")
            }
        }
        .navigationTitle("个人详情")
    }
}

场景2：遍历所有Rosette展示数据 #

要展示全部徽章信息，用ForEach遍历数组：

struct ProfileDetailPage: View {
    let userProfile: UserProfileResponse
    
    var body: some View {
        List {
            Section(header: Text("个人基础信息")) {
                Text("用户名：\(userProfile.userName)")
                Text("当前等级：\(userProfile.level)")
            }
            
            Section(header: Text("徽章列表")) {
                ForEach(userProfile.rosette, id: \.sıra) { rosette in
                    VStack(alignment: .leading, spacing: 4) {
                        Text("徽章名称：\(rosette.rosetteName)")
                        Text("徽章等级：\(rosette.rosetteLevel)")
                        Text("已完成次数：\(rosette.rosetteDone)")
                        Text("完成率：\(String(format: "%.0f%%", rosette.percentageComplete * 100))")
                    }
                }
            }
        }
        .navigationTitle("个人详情")
    }
}

关键注意点 #

• rosette是数组类型，访问单个元素时必须做空值判断，避免数组为空导致崩溃
• 遍历数组时，需给ForEach提供唯一标识符，这里用rosette.sıra（确保sıra字段值唯一）
• 如果UserProfileResponse是从网络/本地解析而来，要确保rosette数组已正确初始化，若为可选类型需先解包

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