SwiftUI：应该如何制定 ForEach 视图才能将数组中的字符串转换为 Text() 视图？

Question

我尝试弄清楚如何使用 SwiftUI 的 ForEach 视图，但没有成功。通过跟踪诸如this、this和this之类的资源，在我看来，给出了一个字符串数组：

\n\n

var arrayOfStrings: [String] = ["String1", "String2", "String3"]

\n\n

...以下每个实现都应该有效：

\n\n

ForEach(arrayOfStrings, id: \\.self) {\n    Text(arrayOfStrings[$0])\n}\n\nForEach(1...arrayOfStrings.count, id: \\.self) {\n    Text(arrayOfStrings[$0])\n}\n\nForEach(arrayOfStrings, id: \\.self) { string in\n    Text(string)\n}\n

\n\n

然而，它们中的每一个都会给我一个编译时错误或在运行时使应用程序崩溃。

\n\n

上面只是示例代码，但如果您需要我想要做的事情的完整上下文，这里是：

\n\n

struct Infobox<Content>: View where Content: View {\n    let edgeSize: CGFloat = 8\n    let color: Color = .neobl\xc3\xa5\n    let content: Content\n\n    var body: some View {\n        VStack(spacing: 0) {\n            BoxSide(.top, withColor: color)\n                .frame(height: edgeSize)\n                .padding(.horizontal, 0)\n\n            content\n                .background(color)\n\n            BoxSide(.bottom, withColor: color)\n                .frame(height: edgeSize)\n                .padding(.horizontal, 0)\n        }\n    }\n\n    init(@ViewBuilder _ content: @escaping () -> Content) {\n        self.content = content()\n    }\n\n    init<T: View>(withHeader headerText: String, forContentArray contentArray: [(text: String, value: String)], splitInTwoColumns twoColumns: Bool, @ViewBuilder ignoreTheClosure: @escaping () -> T) where Content == VStack<TupleView<(HStack<TupleView<(Spacer, Text, Spacer)>>, HStack<TupleView<(VStack<ForEach<ClosedRange<Int>, Int, Text>>, VStack<ForEach<ClosedRange<Int>, Int, Text>>, Spacer, VStack<ForEach<ClosedRange<Int>, Int, Text>>, VStack<ForEach<ClosedRange<Int>, Int, Text>>)>>)>> {\n\n        var column1: [String] = []\n        var column2: [String] = []\n        var column3: [String] = []\n        var column4: [String] = []\n\n        let halfArray = contentArray.count/2\n        for (index, content) in contentArray.enumerated() {\n            if index+1 <= halfArray {\n                column1.append(content.text)\n                column2.append(content.value)\n            } else {\n                column3.append(content.text)\n                column4.append(content.value)\n            }\n        }\n\n        self.init() {\n\n            VStack(alignment: .leading) {\n                HStack() {\n                    Spacer()\n                    Text(headerText)\n                        .font(.headline)\n                    Spacer()\n                }\n                HStack {\n                    VStack {\n                        ForEach(column1, id: \\.self) {\n                            Text(column1[$0])\n                        }\n                    }\n                    VStack {\n                        ForEach(column2, id: \\.self) {\n                            Text(column2[$0])\n                        }\n                    }\n                    Spacer()\n                    VStack {\n                        ForEach(column3, id: \\.self) {\n                            Text(column3[$0])\n                        }\n                    }\n                    VStack {\n                        ForEach(column4, id: \\.self) {\n                            Text(column4[$0])\n                        }\n                    }\n                }\n            }\n        }\n    }\n}\n

\n\n

摘要：给定一个 (String, String) 数组，创建一个 Infobox()，其中包含分为四列的 Text() 元素（两列用于“键”，两列用于相应的值）。

\n\n

如果有人对如何修复这些 ForEach 视图有任何想法，我会给你一个 cookie :)

\n

Answer 1

这个失败了，因为$0是 aString并且你不能用字符串索引你的字符串数组

ForEach(arrayOfStrings, id: \.self) {
    Text(arrayOfStrings[$0])
}

此操作失败，因为数组索引是从 0 开始的 -> 选择 0 基范围：0..<arrayOfStrings.count以避免“索引越界异常”

ForEach(1...arrayOfStrings.count, id: \.self) {
    Text(arrayOfStrings[$0])
}

这通常是正确的，但您可能必须引用您的成员范围限定，self.arrayOfStrings当您的范围是闭包时，这适用于所有 SwiftUI 代码：

ForEach(arrayOfStrings, id: \.self) { string in
    Text(string)
}

这是通过索引进行数组访问的更快捷的方式：

ForEach(arrayOfStrings.indices) {
  Text(self.arrayOfStrings[$0])
}