javascript – Enable and disable boolean based scroll in SvelteKit?

Issue
In SvelteKit, I try to disable and enable scroll when my side menu opens. To do this, I’m trying to use the {open} variable associated with my menu icon with bind: open = {open. I want to trigger the function enableScroll () when open is true, and I want to trigger the function disableScroll () when open is false. Both functions work fine. The “open” variable is correct when I expect it, and I expect it when I use console.log (). The problem is that my if-block doesn’t respond to change.

Which i have tried

  • I have tried to wrap my if-block in another function and call the function changeScroll () on: click.
  • I have tried to adopt the terms: if === true, true, open || Empty Similarly for negation.
  • I have tried to use ternary operator inside binding like: on: click = {open? disableScroll (): enableScroll ()

Currently, my code looks like this:


    $: if (open === true) {
            onMount(() => {
                disableScroll()
            })
        } else if (open === false) {    
            onMount(() => {
                enableScroll()
            })
        }  

Maybe I’m misusing onMount ()? Or do I need to change my if statement so that it can be properly reacted / corrected in some other way? I would gladly appreciate some help! Thanks

Write a Comment