AskOverflow.Dev

AskOverflow.Dev Logo AskOverflow.Dev Logo

AskOverflow.Dev Navigation

  • 主页
  • 系统&网络
  • Ubuntu
  • Unix
  • DBA
  • Computer
  • Coding
  • LangChain

Mobile menu

Close
  • 主页
  • 系统&网络
    • 最新
    • 热门
    • 标签
  • Ubuntu
    • 最新
    • 热门
    • 标签
  • Unix
    • 最新
    • 标签
  • DBA
    • 最新
    • 标签
  • Computer
    • 最新
    • 标签
  • Coding
    • 最新
    • 标签
主页 / coding / 问题 / 76954569
Accepted
Serhii R
Serhii R
Asked: 2023-08-22 22:57:46 +0800 CST2023-08-22 22:57:46 +0800 CST 2023-08-22 22:57:46 +0800 CST

SwiftUI - 带有“绑定”变量的通用视图

  • 772

我有主要的 ImportDataView 和几个选择器的列表。选择器类似,但我需要使用不同的“选择”。每个选取器都位于 ImportDataView 扩展的单独变量(某些视图)中。是否可以使用一个选择器视图而不是 3 个(或更多)并传递/绑定不同的“选择”变量(来自 ImportDataViewModel)?

提前致谢。

import SwiftUI

class ImportDataViewModel: ObservableObject {
   
    @Published var field1Index: Int?
    @Published var field2Index: Int?
    @Published var fieldNIndex: Int?
    
    func getFieldNamesFromCSV() -> [String] {
        return ["fieldFromFile1", "fieldFromFile2", "fieldFromFileN"]
    }
}

struct ImportDataView: View {
    
    @Environment(\.dismiss) var dismiss
    @EnvironmentObject var itVM: ImportDataViewModel
    
    var body: some View {
        NavigationView {
            List {
                HStack {
                    Text("Field 1  *")
                    Spacer()
                    chooseField1View
                }
                HStack {
                    Text("Field 2 *")
                    Spacer()
                    chooseField2View
                }
                HStack {
                    Text("Field N *")
                    Spacer()
                    chooseFieldNView
                }
            }
            .toolbar {
                ToolbarItem(placement: .cancellationAction) {
                    Button("Back", role: .cancel) {
                        dismiss()
                    }
                }
            }
        }
        
    }
}

extension ImportDataView {
    @ViewBuilder
    private var chooseField1View: some View {
        Picker(selection: $itVM.field1Index, label: EmptyView()) {
            ForEach(itVM.getFieldNamesFromCSV().indices, id: \.self) { index in
                Text(itVM.getFieldNamesFromCSV()[index]).tag(index as Int?)
            }
        }
    }
    
    @ViewBuilder
    private var chooseField2View: some View {
        Picker(selection: $itVM.field2Index, label: EmptyView()) {
            ForEach(itVM.getFieldNamesFromCSV().indices, id: \.self) { index in
                Text(itVM.getFieldNamesFromCSV()[index]).tag(index as Int?)
            }
        }
    }
    
    @ViewBuilder
    private var chooseFieldNView: some View {
        Picker(selection: $itVM.fieldNIndex, label: EmptyView()) {
            ForEach(itVM.getFieldNamesFromCSV().indices, id: \.self) { index in
                Text(itVM.getFieldNamesFromCSV()[index]).tag(index as Int?)
            }
        }
    }
}

struct ImportDataView_Previews: PreviewProvider {
    static var previews: some View {
        ImportDataView()
            .environmentObject(ImportDataViewModel())
            .preferredColorScheme(.light)
    }
}

我为每个选择器使用单独的“某些视图”变量,但了解复制/粘贴的方式是错误的。

我希望只有一个“通用”扩展“some View”var,并将其用于所有导入字段,如下所示:

HStack {
   Text("Field 1  *")
   Spacer()
   chooseFieldCommonView(selectionFieldIndex: $itVM.field1Index)
}
HStack {
   Text("Field 2  *")
   Spacer()
   chooseFieldCommonView(selectionFieldIndex: $itVM.field2Index)
}
HStack {
   Text("Field N  *")
   Spacer()
   chooseFieldCommonView(selectionFieldIndex: $itVM.fieldNIndex)
}
swiftui
  • 1 1 个回答
  • 20 Views

1 个回答

  • Voted
  1. Best Answer
    son
    2023-08-23T00:02:45+08:002023-08-23T00:02:45+08:00

    将 ChooseFieldView 拆分为一个新文件,输入为索引(与外部视图模型绑定)和字符串数组作为内容

    struct ChooseFieldView: View {
        
        @Binding var index: Int
        var values: [String]
        
        var body: some View {
            Picker(selection: $index, label: EmptyView()) {
                ForEach(values.indices, id: \.self) { index in
                    Text(values[index]).tag(index)
                }
            }
        }
    }
    

    然后在ImportDataView编辑中像这样:

    struct ImportDataView: View {
        
        @Environment(\.dismiss) var dismiss
        @EnvironmentObject var itVM: ImportDataViewModel
        
        var body: some View {
            NavigationView {
                List {
                    HStack {
                        Text("Field 1  *")
                        Spacer()
                        ChooseFieldView(index: $itVM.field1Index,
                                        values: itVM.getFieldNamesFromCSV())
                    }
                    HStack {
                        Text("Field 2 *")
                        Spacer()
                        ChooseFieldView(index: $itVM.field2Index,
                                        values: itVM.getFieldNamesFromCSV())
                    }
                    HStack {
                        Text("Field N *")
                        Spacer()
                        ChooseFieldView(index: $itVM.fieldNIndex,
                                        values: itVM.getFieldNamesFromCSV())
                    }
                }
                .toolbar {
                    ToolbarItem(placement: .cancellationAction) {
                        Button("Back", role: .cancel) {
                            dismiss()
                        }
                    }
                }
            }
            
        }
    }
    

    结果:

    在此输入图像描述

    • 0

相关问题

  • 创建日历日视图

  • 如何让 SwiftUI 的动画变慢

  • 不理解 SwiftUI 文本布局

Sidebar

Stats

  • 问题 205573
  • 回答 270741
  • 最佳答案 135370
  • 用户 68524
  • 热门
  • 回答
  • Marko Smith

    使用 <font color="#xxx"> 突出显示 html 中的代码

    • 2 个回答
  • Marko Smith

    为什么在传递 {} 时重载解析更喜欢 std::nullptr_t 而不是类?

    • 1 个回答
  • Marko Smith

    您可以使用花括号初始化列表作为(默认)模板参数吗?

    • 2 个回答
  • Marko Smith

    为什么列表推导式在内部创建一个函数?

    • 1 个回答
  • Marko Smith

    我正在尝试仅使用海龟随机和数学模块来制作吃豆人游戏

    • 1 个回答
  • Marko Smith

    java.lang.NoSuchMethodError: 'void org.openqa.selenium.remote.http.ClientConfig.<init>(java.net.URI, java.time.Duration, java.time.Duratio

    • 3 个回答
  • Marko Smith

    为什么 'char -> int' 是提升,而 'char -> Short' 是转换(但不是提升)?

    • 4 个回答
  • Marko Smith

    为什么库中不调用全局变量的构造函数?

    • 1 个回答
  • Marko Smith

    std::common_reference_with 在元组上的行为不一致。哪个是对的?

    • 1 个回答
  • Marko Smith

    C++17 中 std::byte 只能按位运算?

    • 1 个回答
  • Martin Hope
    fbrereto 为什么在传递 {} 时重载解析更喜欢 std::nullptr_t 而不是类? 2023-12-21 00:31:04 +0800 CST
  • Martin Hope
    比尔盖子 您可以使用花括号初始化列表作为(默认)模板参数吗? 2023-12-17 10:02:06 +0800 CST
  • Martin Hope
    Amir reza Riahi 为什么列表推导式在内部创建一个函数? 2023-11-16 20:53:19 +0800 CST
  • Martin Hope
    Michael A fmt 格式 %H:%M:%S 不带小数 2023-11-11 01:13:05 +0800 CST
  • Martin Hope
    God I Hate Python C++20 的 std::views::filter 未正确过滤视图 2023-08-27 18:40:35 +0800 CST
  • Martin Hope
    LiDa Cute 为什么 'char -> int' 是提升,而 'char -> Short' 是转换(但不是提升)? 2023-08-24 20:46:59 +0800 CST
  • Martin Hope
    jabaa 为什么库中不调用全局变量的构造函数? 2023-08-18 07:15:20 +0800 CST
  • Martin Hope
    Panagiotis Syskakis std::common_reference_with 在元组上的行为不一致。哪个是对的? 2023-08-17 21:24:06 +0800 CST
  • Martin Hope
    Alex Guteniev 为什么编译器在这里错过矢量化? 2023-08-17 18:58:07 +0800 CST
  • Martin Hope
    wimalopaan C++17 中 std::byte 只能按位运算? 2023-08-17 17:13:58 +0800 CST

热门标签

python javascript c++ c# java typescript sql reactjs html

Explore

  • 主页
  • 问题
    • 最新
    • 热门
  • 标签
  • 帮助

Footer

AskOverflow.Dev

关于我们

  • 关于我们
  • 联系我们

Legal Stuff

  • Privacy Policy

Language

  • Pt
  • Server
  • Unix

© 2023 AskOverflow.DEV All Rights Reserve