Data SwiftUI中的基于列表的视图

Question

带有错误的新代码。这就是我犯错误的地方。我有两组数据，将分两组显示。具有雇员的地点1和具有不同雇员集合的地点2。当我添加第二个列表if employees时，我会在Loc2文件的NavigationLink(destination: DetailView(data: listedPeople)) {行得到错误Cannot convert value of type 'DataUI' to expected argument type 'Data。

希望这能很好地解释它。

放置在一个名为ContentView的文件中

struct Home: View {
var body: some View {
TabView {
loc1()
.tabItem {
VStack{
Image(systemName: "person.3.fill")
Text ("Location 1")
}
}
.tag(2)
loc2()
.tabItem {
VStack{
Image(systemName: "person.fill")
Text ("Location 2")
}
}
}
}
}

放置在名为loc1的文件2中

struct Data: Identifiable{
var id  = Int ()
let title, imageUrl, Dev, URL: String
}
struct loc1: View {
let data:[Data] = [
Data(id: 0, title: "Cook", imageUrl: "hh",Dev:"John", URL: "school"),
Data(id: 1, title: "Staff", imageUrl: "JJ",Dev:"Harper", URL: "home" ),
Data(id: 2, title: "Busser", imageUrl: "uu",Dev:"Matt", URL: "Table"),
Data(id: 3, title: "Host", imageUrl: "tt",Dev:"Jacob", URL: "Door")]

var body: some View {
NavigationView {
List(data) { listedPeople in
NavigationLink(destination: DetailView(data: listedPeople)) {
HStack{
Image(listedPeople.imageUrl)
.resizable()
.cornerRadius(12)
.frame(width:30, height:30)
VStack (alignment: .leading){
Text(listedPeople.title)
.font(.headline)
Text(listedPeople.Dev)
.font(.subheadline)
}
}
}.navigationBarTitle(Text("location 1"))
}
}
}
}

将代码放入名为loc2的新文件中(这是我的错误所在(

import SwiftUI
struct DataUI: Identifiable{
var id  = Int ()
let title, imageUrl, Dev, URL: String
}
struct loc2: View {
let data:[DataUI] = [
DataUI(id: 0, title: "Cook", imageUrl: "hh",Dev:"Bob", URL: "school"),
DataUI(id: 1, title: "Staff", imageUrl: "JJ",Dev:"Joe", URL: "home" ),
DataUI(id: 2, title: "Busser", imageUrl: "uu",Dev:"Nick", URL: "Table"),
DataUI(id: 3, title: "Host", imageUrl: "tt",Dev:"Hunter", URL: "Door")]

var body: some View {
NavigationView {
List(data) { listedPeople in
NavigationLink(destination: DetailView(data: listedPeople)) {
HStack{
Image(listedPeople.imageUrl)
.resizable()
.cornerRadius(12)
.frame(width:30, height:30)
VStack (alignment: .leading){
Text(listedPeople.title)
.font(.headline)
Text(listedPeople.Dev)
.font(.subheadline)
}
}
}.navigationBarTitle(Text("Location2"))
}
}
}
}

创建一个名为DetailView的新文件

import SwiftUI
struct DetailView : View{
var data: Data
var body: some View {
NavigationView{
List {
HStack{
Image(data.imageUrl)
.resizable()
.frame(width:70, height:60)
.clipShape(Circle())
.shadow(radius: 10)
.overlay(Circle().stroke(Color.black, lineWidth: 1))
VStack{
Text(data.title)
.font (.title)
HStack{
Image(systemName: "envelope.fill")
.resizable()
.frame(width:20, height: 15)
Text("Data.URL")
.font (.subheadline)
}
}
}.navigationBarTitle(Text("Data.title"))
}
}
}
}

Answer 1

看看这个！

struct Data: Identifiable{
var id  = Int ()
let title, imageUrl, Dev, URL: String
}
struct ContentView: View {
let data:[Data] = [

Data(id: 0, title: "Cook", imageUrl: "hh",Dev:"John", URL: "school"),
Data(id: 1, title: "Staff", imageUrl: "JJ",Dev:"Harper", URL: "home" ),
Data(id: 2, title: "Busser", imageUrl: "uu",Dev:"Matt", URL: "Table"),
Data(id: 3, title: "Host", imageUrl: "tt",Dev:"Jacob", URL: "Door")]
var body: some View {
NavigationView {
List(data) { listedPeople in
NavigationLink(destination: DetailView(data: listedPeople)) {
HStack{
Image(listedPeople.imageUrl)
.resizable()
.cornerRadius(12)
.frame(width:30, height:30)
VStack (alignment: .leading){
Text(listedPeople.title)
.font(.headline)
Text(listedPeople.Dev)
.font(.subheadline)
}
}
}.navigationBarTitle(Text("Restraunt"))
}
}
}
}
struct DetailView : View{
var data: Data
var body: some View {
NavigationView{
List {
HStack{
Image(data.imageUrl)
.resizable()
.frame(width:70, height:60)
.clipShape(Circle())
.shadow(radius: 10)
.overlay(Circle().stroke(Color.black, lineWidth: 1))
VStack{
Text(data.title)
.font (.title)
HStack{
Image(systemName: "envelope.fill")
.resizable()
.frame(width:20, height: 15)
Text("Data.URL")
.font (.subheadline)
}
}
}.navigationBarTitle(Text("Data.title"))
}
}
}
}

Answer 2

您已经混合了Data和DataUI。。。这就是问题所在。我真的不知道为什么你定义了两个不同名称的结构，而它们完全相同？

我纠正了这个问题，现在它运行了，

这是解决方案：

import SwiftUI
struct ContentView: View {
var body: some View {
TabView {
loc1()
.tabItem {
VStack{
Image(systemName: "person.3.fill")
Text ("Location 1")
}
}
.tag(2)
loc2()
.tabItem {
VStack{
Image(systemName: "person.fill")
Text ("Location 2")
}
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
struct loc1: View {
let dataUI:[DataUI] = [
DataUI(id: 0, title: "Cook", imageUrl: "hh",Dev:"John", URL: "school"),
DataUI(id: 1, title: "Staff", imageUrl: "JJ",Dev:"Harper", URL: "home" ),
DataUI(id: 2, title: "Busser", imageUrl: "uu",Dev:"Matt", URL: "Table"),
DataUI(id: 3, title: "Host", imageUrl: "tt",Dev:"Jacob", URL: "Door")]

var body: some View {
NavigationView {
List(dataUI) { listedPeople in
NavigationLink(destination: DetailView(dataUI: listedPeople)) {
HStack{
Image(listedPeople.imageUrl)
.resizable()
.cornerRadius(12)
.frame(width:30, height:30)
VStack (alignment: .leading){
Text(listedPeople.title)
.font(.headline)
Text(listedPeople.Dev)
.font(.subheadline)
}
}
}.navigationBarTitle(Text("location 1"))
}
}
}
}
struct loc1_Previews: PreviewProvider {
static var previews: some View {
loc1()
}
}
struct DataUI: Identifiable{
var id  = Int ()
let title, imageUrl, Dev, URL: String
}
struct loc2: View {
let dataUI:[DataUI] = [
DataUI(id: 0, title: "Cook", imageUrl: "hh",Dev:"Bob", URL: "school"),
DataUI(id: 1, title: "Staff", imageUrl: "JJ",Dev:"Joe", URL: "home" ),
DataUI(id: 2, title: "Busser", imageUrl: "uu",Dev:"Nick", URL: "Table"),
DataUI(id: 3, title: "Host", imageUrl: "tt",Dev:"Hunter", URL: "Door")]

var body: some View {
NavigationView {
List(dataUI) { listedPeople in
NavigationLink(destination: DetailView(dataUI: listedPeople)) {
HStack{
Image(listedPeople.imageUrl)
.resizable()
.cornerRadius(12)
.frame(width:30, height:30)
VStack (alignment: .leading){
Text(listedPeople.title)
.font(.headline)
Text(listedPeople.Dev)
.font(.subheadline)
}
}
}.navigationBarTitle(Text("Location2"))
}
}
}
}
struct DetailView : View{
var dataUI: DataUI
var body: some View {
NavigationView{
List {
HStack{
Image(dataUI.imageUrl)
.resizable()
.frame(width:70, height:60)
.clipShape(Circle())
.shadow(radius: 10)
.overlay(Circle().stroke(Color.black, lineWidth: 1))
VStack{
Text(dataUI.title)
.font (.title)
HStack{
Image(systemName: "envelope.fill")
.resizable()
.frame(width:20, height: 15)
Text("Data.URL")
.font (.subheadline)
}
}
}.navigationBarTitle(Text("Data.title"))
}
}
}
}