包含购物车的 SwiftUI 标签页视图

问：

我在swiftUI中有视图。我有选项卡视图列表。这是我想做的.当我单击添加到购物车按钮时，我希望购物车值增加并且工作正常，但问题是计数显示在选项卡视图的底部，我希望它像预览一样显示在购物车视图的顶部，它显示正确。

这是主视图..

import SwiftUI

struct MainView: View {

   @EnvironmentObject var  order: Order

    var body: some View {
        TabView {
            
            OrderView()
                .tabItem {
                    CartButton(numberOfProducts: order.product.count)
                }
        }
    }
}

这是购物车按钮视图。

import SwiftUI

struct CartButton: View {
    var numberOfProducts: Int

    var body: some View {
        ZStack(alignment: .topTrailing) {
            Image(systemName: "cart")
                .padding(.top, 5)

            if numberOfProducts > 0 {
                Text("\(numberOfProducts)")
                    .font(.caption2).bold()
                    .foregroundColor(.white)
                    .frame(width: 15, height: 15)
                    .background(Color(hue: 1.0, saturation: 0.89, brightness: 0.835))
                    .cornerRadius(50)
            }
        }
    }
}

这是购物车按钮的预览并正确显示..

这是选项卡视图的屏幕截图。正如我单击添加到购物车按钮时所显示的那样，它增加了购物车图像的计数并显示在 Botton 上。