TopLeft
BottomLeft
TopRight
BottomRight
Scroll Me
isLocked false

useScrollLock

Lock scrolling of the element.

Usage

<script setup lang="ts">
import { useScrollLock } from '@vueuse/core'

const el = ref<HTMLElement | null>(null)
const isLocked = useScrollLock(el)

isLocked.value = true // lock
isLocked.value = false // unlock
</script>

<template>
  <div ref="el"></div>
</template>

Type Declarations

/**
 * Lock scrolling of the element.
 *
 * @see https://vueuse.org/useScrollLock
 * @param element
 */
export declare function useScrollLock(
  element: MaybeRef<
    HTMLElement | SVGElement | Window | Document | null | undefined
  >,
  initialState?: boolean
): WritableComputedRef<boolean>

Source

SourceDemoDocs