Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

Blazor not running javascript when navigating to the current/same page

$
0
0

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?


Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>