tdesign-mobile-vue
Version:
tdesign-mobile-vue
1 lines • 2.03 kB
Source Map (JSON)
{"version":3,"file":"useTeleport.mjs","sources":["../../src/hooks/useTeleport.ts"],"sourcesContent":["import { computed, Ref, onMounted, ref, watch } from 'vue';\nimport { isFunction } from 'lodash-es';\nimport { getSSRAttach, getAttach } from '../shared/dom';\nimport { AttachNode } from '../common';\n\n/**\n * @description 返回挂载的节点, 用于teleport\n * @param attach 既可以是一个函数, 也可以是一个ref\n * @param triggerNode 既可以是一个函数, 也可以是一个ref\n */\nconst useTeleport = (\n attach: (() => AttachNode) | Ref<AttachNode>,\n triggerNode?: (() => any) | Ref<any>,\n): Ref<string | Element> => {\n // 如果是函数, 则使用computed包裹 否则直接使用ref\n const to = isFunction(attach) ? computed(attach) : ref(attach);\n const innerTriggerNode = isFunction(triggerNode) ? computed(triggerNode) : ref(triggerNode);\n\n const element = ref<string | Element>();\n\n const getElement = () => {\n element.value = getSSRAttach() || getAttach(to.value, innerTriggerNode.value);\n };\n\n onMounted(() => getElement());\n\n watch([to, innerTriggerNode], () => getElement());\n\n return element;\n};\n\nexport default useTeleport;\n"],"names":["useTeleport","attach","triggerNode","to","isFunction","computed","ref","innerTriggerNode","element","getElement","value","getSSRAttach","getAttach","onMounted","watch"],"mappings":";;;;;;;;;;AAUMA,IAAAA,WAAA,GAAc,SAAdA,WAAAA,CACJC,MAAA,EACAC,WAC0B,EAAA;AAEpB,EAAA,IAAAC,EAAA,GAAKC,WAAWH,MAAM,CAAA,GAAII,SAASJ,MAAM,CAAA,GAAIK,IAAIL,MAAM,CAAA,CAAA;AACvD,EAAA,IAAAM,gBAAA,GAAmBH,WAAWF,WAAW,CAAA,GAAIG,SAASH,WAAW,CAAA,GAAII,IAAIJ,WAAW,CAAA,CAAA;AAE1F,EAAA,IAAMM,UAAUF,GAAsB,EAAA,CAAA;AAEtC,EAAA,IAAMG,aAAa,SAAbA,aAAmB;AACvBD,IAAAA,OAAA,CAAQE,QAAQC,YAAa,EAAA,IAAKC,UAAUT,EAAG,CAAAO,KAAA,EAAOH,iBAAiBG,KAAK,CAAA,CAAA;GAC9E,CAAA;AAEUG,EAAAA,SAAA,CAAA,YAAA;IAAA,OAAMJ,YAAY,CAAA;GAAA,CAAA,CAAA;AAE5BK,EAAAA,KAAA,CAAM,CAACX,EAAI,EAAAI,gBAAgB,CAAG,EAAA,YAAA;IAAA,OAAME,YAAY,CAAA;GAAA,CAAA,CAAA;AAEzC,EAAA,OAAAD,OAAA,CAAA;AACT;;;;"}