Portal.js 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. import { createVNode as _createVNode, resolveDirective as _resolveDirective } from "vue";
  2. import PropTypes from './vue-types';
  3. import { defineComponent, nextTick, onBeforeMount, onMounted, onUpdated, Teleport, watch } from 'vue';
  4. import { useInjectPortal } from '../vc-trigger/context';
  5. export default defineComponent({
  6. compatConfig: {
  7. MODE: 3
  8. },
  9. name: 'Portal',
  10. inheritAttrs: false,
  11. props: {
  12. getContainer: PropTypes.func.isRequired,
  13. didUpdate: Function
  14. },
  15. setup(props, _ref) {
  16. let {
  17. slots
  18. } = _ref;
  19. let isSSR = true;
  20. // getContainer 不会改变,不用响应式
  21. let container;
  22. const {
  23. shouldRender
  24. } = useInjectPortal();
  25. function setContainer() {
  26. if (shouldRender.value) {
  27. container = props.getContainer();
  28. }
  29. }
  30. onBeforeMount(() => {
  31. isSSR = false;
  32. // drawer
  33. setContainer();
  34. });
  35. onMounted(() => {
  36. if (container) return;
  37. // https://github.com/vueComponent/ant-design-vue/issues/6937
  38. setContainer();
  39. });
  40. const stopWatch = watch(shouldRender, () => {
  41. if (shouldRender.value && !container) {
  42. container = props.getContainer();
  43. }
  44. if (container) {
  45. stopWatch();
  46. }
  47. });
  48. onUpdated(() => {
  49. nextTick(() => {
  50. var _a;
  51. if (shouldRender.value) {
  52. (_a = props.didUpdate) === null || _a === void 0 ? void 0 : _a.call(props, props);
  53. }
  54. });
  55. });
  56. // onBeforeUnmount(() => {
  57. // if (container && container.parentNode) {
  58. // container.parentNode.removeChild(container);
  59. // }
  60. // });
  61. return () => {
  62. var _a;
  63. if (!shouldRender.value) return null;
  64. if (isSSR) {
  65. return (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots);
  66. }
  67. return container ? _createVNode(Teleport, {
  68. "to": container
  69. }, slots) : null;
  70. };
  71. }
  72. });