Skip to content

⬅️ Back to Table of Contents

📄 useParentElement

📊 Analysis Summary

Metric Count
🔧 Functions 2
📦 Imports 8
🟢 Vue Composition API 1

📚 Table of Contents

🛠️ File Location:

📂 packages/core/useParentElement/index.ts

📦 Imports

Name Source
MaybeRefOrGetter vue
ShallowRef vue
tryOnMounted @vueuse/shared
shallowRef vue
toValue vue
watch vue
unrefElement ../unrefElement
useCurrentElement ../useCurrentElement

Vue Composition API

Name Type Reactive Variables Composables
watch watch none none

Functions

useParentElement(element: MaybeRefOrGetter<HTMLElement | SVGEleme…): Readonly<ShallowRef<HTMLElement | SVGElement | null | undef…

Parameters:

  • element MaybeRefOrGetter<HTMLElement | SVGElement | null | undefined>

Returns: Readonly<ShallowRef<HTMLElement | SVGElement | null | undefined>>

Calls:

  • shallowRef (from vue)
  • unrefElement (from ../unrefElement)
  • tryOnMounted (from @vueuse/shared)
  • watch (from vue)
  • toValue (from vue)
Code 
export function useParentElement(
  element: MaybeRefOrGetter<HTMLElement | SVGElement | null | undefined> = useCurrentElement<HTMLElement | SVGAElement>(),
): Readonly<ShallowRef<HTMLElement | SVGElement | null | undefined>> {
  const parentElement = shallowRef<HTMLElement | SVGElement | null | undefined>()

  const update = () => {
    const el = unrefElement(element)
    if (el)
      parentElement.value = el.parentElement
  }

  tryOnMounted(update)
  watch(() => toValue(element), update)

  return parentElement
}

Internal helpers

Declared inside another function in this file.

update(): void

Returns: void

Calls:

  • unrefElement (from ../unrefElement)
Code 
() => {
    const el = unrefElement(element)
    if (el)
      parentElement.value = el.parentElement
  }

Generated by Syntax Scribe