Search icon
Subscription
0
Cart icon
Close icon
You have no products in your basket yet
Arrow left icon
All Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Newsletters
Free Learning
Arrow right icon
Mastering Blazor WebAssembly

You're reading from  Mastering Blazor WebAssembly

Product type Book
Published in Aug 2023
Publisher Packt
ISBN-13 9781803235103
Pages 370 pages
Edition 1st Edition
Languages
Author (1):
Ahmad Mozaffar Ahmad Mozaffar
Profile icon Ahmad Mozaffar

Table of Contents (21) Chapters

Preface 1. Part 1: Blazor WebAssembly Essentials
2. Chapter 1: Understanding the Anatomy of a Blazor WebAssembly Project 3. Chapter 2: Components in Blazor 4. Chapter 3: Developing Advanced Components in Blazor 5. Part 2: App Parts and Features
6. Chapter 4: Navigation and Routing 7. Chapter 5: Capturing User Input with Forms and Validation 8. Chapter 6: Consuming JavaScript in Blazor 9. Chapter 7: Managing Application State 10. Chapter 8: Consuming Web APIs from Blazor WebAssembly 11. Chapter 9: Authenticatiwng and Authorizing Users in Blazor 12. Chapter 10: Handling Errors in Blazor WebAssembly 13. Part 3: Optimization and Deployment
14. Chapter 11: Giving Your App a Speed Boost 15. Chapter 12: RenderTree in Blazor 16. Chapter 13: Testing Blazor WebAssembly Apps 17. Chapter 14: Publishing Blazor WebAssembly Apps 18. Chapter 15: What’s Next? 19. Index 20. Other Books You May Enjoy

Reacting to navigation changes

In the logic of your apps, sometimes, you need to react to the navigation of the user by taking them to a new URL for many reasons, such as needing to highlight a certain component in the UI if the user navigates to a specific URL, or needing to execute a piece of code when the user navigates from the current page. In this section, we will learn about the NavLink component and LocationChanged within the NavigationManager service.

The NavLink Component

Blazor contains a built-in component called NavLink. This component is basically just the normal hyperlink tag (<a>) in HTML that allows the user to redirect to a specific link using the href attribute. What makes NavLink different from using the normal HTML hyperlink tag is that NavLink reacts to the URL changes, and if the current URL matches the link defined in its href attribute, it sets a CSS class called active and removes it when the URL doesn’t match. That makes the NavLink component...

lock icon The rest of the chapter is locked
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at $15.99/month. Cancel anytime}