diff --git a/src/components/misc/modal.vue b/src/components/misc/modal.vue
index 5095b0a72c..3ba34cd336 100644
--- a/src/components/misc/modal.vue
+++ b/src/components/misc/modal.vue
@@ -71,10 +71,9 @@ export default {
 
 <script lang="ts" setup>
 import BaseButton from '@/components/base/BaseButton.vue'
-import {onUnmounted, ref, useAttrs, watch} from 'vue'
+import {ref, useAttrs, watchEffect} from 'vue'
 import {useScrollLock} from '@vueuse/core'
 
-
 const props = withDefaults(defineProps<{
 	enabled?: boolean,
 	overflow?: boolean,
@@ -94,14 +93,9 @@ const attrs = useAttrs()
 const modal = ref<HTMLElement | null>(null)
 const scrollLock = useScrollLock(modal)
 
-watch(
-	() => props.enabled,
-	enabled => {
-		scrollLock.value = enabled
-	},
-)
-
-onUnmounted(() => scrollLock.value = false)
+watchEffect(() => {
+	scrollLock.value = props.enabled
+})
 </script>
 
 <style lang="scss" scoped>