I'm having an issue where clicking a navigation link to the current page resets html attributes and dark theme. Here's how I have it set up:
app.js
let darkMode = localStorage.getItem("darkMode") == "true"; //returns stored value or null if not setfunction setUpDarkMode() { if (darkMode) { toggleDarkMode(); document.getElementById("dark-mode").checked = true; }}function updateDarkMode() { darkMode = !darkMode; localStorage.setItem("darkMode", darkMode); toggleDarkMode(); }function toggleDarkMode() { if (darkMode) { document.documentElement.setAttribute('data-bs-theme', 'dark'); } else { document.documentElement.setAttribute('data-bs-theme', 'light'); }};*.razor (all my razor pages)
@inject IJSRuntime JS@rendermode @(new InteractiveServerRenderMode(prerender: false))@code { protected override async Task OnInitializedAsync() { await JS.InvokeVoidAsync("setUpDarkMode"); }}Now this works perfectly fine if I'm on www.mysite.com/test and navigate to a different page, such as www.mysite.com/anotherpage. But if I click on a navigation link that takes me to the current page (www.mysite.com/test in this case) then the html attributes just reset and JS.InvokeVoidAsync is never called. I tried OnParametersSetAsync but this isn't called either. Am I doing something wrong here?