英文:
Two back buttons appearing whilst using NavigationLink
问题
我已经为您翻译了您的代码部分，如下：
struct Marketplace: View {
var body: some View {
NavigationView {
MarketplaceShoesView()
}
}
}
struct MarketplaceShoesView: View {
var body: some View {
ScrollView {
ShoeRowView(shoeData: shoe)
}
}
}
struct ShoeRowView: View {
@State private var isShowingDetailView = false
var shoeData: ShoeRow
var body: some View {
VStack {
HStack {
Text(shoeData.title)
HStack {
NavigationLink("", isActive: $isShowingDetailView) {
ShoesSeeAllView(shoeData: shoeData, shoe_id: shoeData.id)
}
.navigationTitle("")
Button("See All") {
isShowingDetailView = true
}
Image(systemName: "chevron.right")
}
.padding(.trailing)
}
HStack {
ScrollView(.horizontal, showsIndicators: false) {
HStack(spacing: 20) {
ForEach(shoeData.shoes ?? []) { shoe in
Text("Name of shoes")
}
}
.padding()
}
}
Divider()
}
}
}
struct ShoeSeeAllView: View {
var shoeData: ShoeStruct
var shoe_id: String
var body: some View {
NavigationView {
ScrollView(.vertical, showsIndicators: false) {
VStack {
VStack(spacing: 25) {
ForEach(shoeData.shoes ?? []) { shoe in
ShoeViewLong(shoeData: shoe)
}
}
}
}
}
.navigationTitle(shoeData.title)
}
}
struct ShoeViewLong: View {
var shoeData: ShoeStruct
var body: some View {
NavigationLink(destination: ShoeDetailView(shoe_id: shoeData.id ?? "")) {
HStack(spacing: 12){
Image("ShoeImage")
.resizable()
Text("Shoes Name")
}
}
}
}
struct ShoeDetailView: View {
var body: some View {
Text("This is shoes detail view")
}
}
如您所描述，导航的问题是有两个返回按钮。要解决这个问题，您可以将NavigationView包装在MarketplaceShoesView内，然后在ShoeSeeAllView和ShoeDetailView中将导航标题设为空。这将确保在ShoeSeeAllView和ShoeDetailView中没有多余的返回按钮。这是示例更改：
struct MarketplaceShoesView: View {
var body: some View {
NavigationView { // 包装NavigationView在MarketplaceShoesView内
ScrollView {
ShoeRowView(shoeData: shoe)
}
}
}
}
struct ShoeSeeAllView: View {
var shoeData: ShoeStruct
var shoe_id: String
var body: some View {
ScrollView(.vertical, showsIndicators: false) {
VStack {
VStack(spacing: 25) {
ForEach(shoeData.shoes ?? []) { shoe in
ShoeViewLong(shoeData: shoe)
}
}
}
}
.navigationTitle("") // 将导航标题设为空
}
}
struct ShoeDetailView: View {
var body: some View {
Text("This is shoes detail view")
}
}
这些更改应该解决导航中的多个返回按钮问题，使导航按照您所描述的方式工作。
英文:
I have a project I am working on. I have minimised the project to show the layered views for the purpose of this question.
The project displays ShoeRowView in a ScrollView. The ShowRowView features a Button titled "See All". This button takes the user to ShoeSeeAllView. This is where there is a VStack listing all the different pairs of shoes in the form of a view called ShoeViewLong.
When a ShowViewLong is tapped, it takes the user to ShoeDetailView.
The Navigation works as expected but the issue is there are two back buttons, one under the other.
I have tried using an @State var with @Binding but can't seem to get anything to work.
Here is the code:
struct Marketplace: View {
var body: some View {
NavigationView {
MarketplaceShoesView()
}
}
}
struct MarketplaceShoesView: View {
var body: some View {
ScrollView {
ShoeRowView(shoeData: shoe)
}
}
}
struct ShoeRowView: View {
@State private var isShowingDetailView = false
var shoeData: ShoeRow
var body: some View {
VStack {
HStack {
Text(shoeData.title)
HStack {
NavigationLink("", isActive: $isShowingDetailView){ShoesSeeAllView(shoeData: shoeData, shoe_id: shoeData.id)}
.navigationTitle("")
Button("See All") {
isShowingDetailView = true
}
Image(systemName: "chevron.right")
}
.padding(.trailing)
}
HStack {
ScrollView(.horizontal, showsIndicators: false) {
HStack(spacing: 20) {
ForEach(shoeData.shoes ?? []) { shoe in
Text("Name of shoes")
}
}
.padding()
}
}
Divider()
}
}
}
struct ShoeSeeAllView: View {
var shoeData: ShoeStruct
var shoe_id: String
var body: some View {
NavigationView {
ScrollView(.vertical, showsIndicators: false) {
VStack {
VStack(spacing: 25) {
ForEach(shoeData.shoes ?? []) { shoe in
ShoeViewLong(shoeData: shoe)
}
}
}
}
}
.navigationTitle(shoeData.title)
}
}
struct ShoeViewLong: View {
var shoeData: ShoeStruct
var body: some View {
NavigationLink(destination: ShoeDetailView(shoe_id: shoeData.id ?? "")) {
HStack(spacing: 12){
Image("ShoeImage")
.resizable()
Text("Shoes Name")
}
}
}
}
struct ShoeDetailView: View {
var body: some View {
Text("This is shoes detail view")
}
}
How can I fix the Navigation? It should go like this:
Tap "See All" (in a ShoesRowView) -> ShoesSeeAllView -> Tap a ShoeViewLong -> Take to ShoeDetailView.
When in ShoeDetailView, the user taps back button -> goes to ShoesSeeAllView > Tap back again -> goes to MarketplaceShoesView (where ShoeRowView is being displayed)
答案1
得分: 0
问题出在嵌套的NavigationView上。将ShoeSeeAllView中的NavigationView移除后，问题得以解决。
英文:
The problem was with nested NavigationView's. After removing NavigationView from ShoeSeeAllView, the problem was solved.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论