Search⌘ K
AI Features
Home
Courses
Building Real-Life Applications with Blazor WebAssembly

Adding the Cart Total to All of the Pages

Understand how to persist and display the shopping cart total on every page by integrating it into the MainLayout component. Learn to update the UI using Blazor's event handling and StateHasChanged method while managing resources by properly unsubscribing events.

We'll cover the following...

To view the cart total on all of the pages, we need to add the cart total to a component that is used on all of the pages. Since the MainLayout component is used by all of the pages, we will add the cart total to it. We do this as follows:

  1. Return to Visual Studio.
  2. Open the Shared\MainLayout.razor page.
  3. Add the following @using directive:
C++
@using ShoppingCart.Services
  1. Add the following @inject directive:
C++
@inject ICartService cartService
...