Xcode SwiftUI leading navigationBarItem not working but trailing navigationBarItem does work

Question

I'm a new Xcode/SwiftUI programmer, and I've encountered a problem in my ThirdView code (below) whereby the exact same button code works as expected as a trailing navigationBarItem but does not appear at all when I move the button and associated code to the leading bar item spot. The following code illustrates the issue.

This code sample is virtually identical to the code for a previous question I posted (which a very helpful StackOverflow community member helped me resolve); my question here concerns a different problem in the same code.

struct ContentView: View {
    @State private var activeLink: Bool = false
    var body: some View {
        NavigationView {
            VStack {
                Spacer()
                NavigationLink("Show Second Screen",
                    destination: SecondView(active: $activeLink), isActive: $activeLink)
                Spacer()
            }.padding()
            .navigationBarTitle("First view")
        } // End of NavigationView
    } // End of body
} // End of ContentView

struct SecondView: View {
    @Binding var active: Bool
    @State private var thirdViewLink: Bool = false
    
    var body: some View {
        VStack {
        Spacer()
        NavigationLink(destination: ThirdView(thirdViewActive: $thirdViewLink),
                       isActive: $thirdViewLink) {
            EmptyView()
        } // End of NavigationLink
        Spacer()
        }.padding() // End of VStack
        .navigationBarTitle("Second View")
        .navigationBarBackButtonHidden(true)
        .navigationBarItems(leading: Button("Back to 1st View") {
            self.active = false
        }, trailing: Button("Show Third View") {
            self.thirdViewLink = true
        }
        )
    } // End of body
} // End of SecondView

struct ThirdView: View {
    @Binding var thirdViewActive: Bool
    var body: some View {
        VStack(spacing: 15) {
            Text("Third View")
            Spacer()
        }.padding() // End of VStack
        .navigationBarBackButtonHidden(true)
        //The following approach does NOT work
        .navigationBarItems(leading: Button("Back to 2nd View") {
            self.thirdViewActive = false
        })
        // This DOES work - why the difference?
     /* .navigationBarItems(trailing: Button("Back to 2nd View") {
            self.thirdViewActive = false
        }) */
    } // End of body
} // End of ThirdView

Why does the ThirdView button for "Back to 2nd View" only appear when I assign it to the trailing navigationBarItems() location? How can I make a button in this situation appear in the leading location? Many thanks for any insight you're able to provide!

Answer 1

your code works well for me on macos 12.beta, xcode 13.beta, target ios 15 and macCatalyst 12, when I use this:

struct ContentView: View {
    @State private var activeLink: Bool = false
    var body: some View {
        NavigationView {
            VStack {
                Spacer()
                NavigationLink("Show Second Screen",
                    destination: SecondView(active: $activeLink), isActive: $activeLink)
                Spacer()
            }.padding()
            .navigationBarTitle("First view")
        } // End of NavigationView
        .navigationViewStyle(.stack)  // <--- here
    } // End of body
} // End of ContentView

Tested on macOS 12 and iPhone and iPad ios15.