diff --git a/packages/integrations/useFocusTrap/component.ts b/packages/integrations/useFocusTrap/component.ts
index 50fd72450c5..31b204b114b 100644
--- a/packages/integrations/useFocusTrap/component.ts
+++ b/packages/integrations/useFocusTrap/component.ts
@@ -3,10 +3,15 @@ import { createFocusTrap } from 'focus-trap'
 import type { FocusTrap } from 'focus-trap'
 import type { RenderableComponent } from '@vueuse/core'
 import { unrefElement } from '@vueuse/core'
+import type { UseFocusTrapOptions } from '.'
 
-export const UseFocusTrap = defineComponent<RenderableComponent>({
+export interface ComponentUseFocusTrapOptions extends RenderableComponent {
+  options?: UseFocusTrapOptions
+}
+
+export const UseFocusTrap = defineComponent <ComponentUseFocusTrapOptions> ({
   name: 'UseFocusTrap',
-  props: ['as'] as unknown as undefined,
+  props: ['as', 'options'] as unknown as undefined,
   setup(props, { slots }) {
     let trap: undefined | FocusTrap
     const target = ref()
@@ -18,7 +23,7 @@ export const UseFocusTrap = defineComponent<RenderableComponent>({
       (el) => {
         if (!el)
           return
-        trap = createFocusTrap(el, {})
+        trap = createFocusTrap(el, props.options || {})
         activate()
       }, { flush: 'post' })
 
diff --git a/packages/integrations/useFocusTrap/index.md b/packages/integrations/useFocusTrap/index.md
index 58de89b19e5..f0f2e53a20f 100644
--- a/packages/integrations/useFocusTrap/index.md
+++ b/packages/integrations/useFocusTrap/index.md
@@ -64,7 +64,7 @@ const show = ref(false)
 </script>
 
 <template>
-  <UseFocusTrap v-if="show">
+  <UseFocusTrap v-if="show" :options="{ immediate: true }">
     <div class="modal">...</div>
   </UseFocusTrap>
 </template>