1234567891011121314151617181920212223242526272829303132333435363738 |
- import { provide } from 'vue'
- import type { InjectionKey, ObjectDirective, Ref } from 'vue'
- type ForwardRefSetter = <T>(el: T) => void
- export type ForwardRefInjectionContext = {
- setForwardRef: ForwardRefSetter
- }
- export const FORWARD_REF_INJECTION_KEY: InjectionKey<ForwardRefInjectionContext> =
- Symbol('elForwardRef')
- export const useForwardRef = <T>(forwardRef: Ref<T | null>) => {
- const setForwardRef = (el: T) => {
- forwardRef.value = el
- }
- provide(FORWARD_REF_INJECTION_KEY, {
- setForwardRef,
- })
- }
- export const useForwardRefDirective = (
- setForwardRef: ForwardRefSetter
- ): ObjectDirective => {
- return {
- mounted(el) {
- setForwardRef(el)
- },
- updated(el) {
- setForwardRef(el)
- },
- unmounted() {
- setForwardRef(null)
- },
- }
- }
|