Portal.js 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.default = void 0;
  7. var _vue = require("vue");
  8. var _vueTypes = _interopRequireDefault(require("./vue-types"));
  9. var _context = require("../vc-trigger/context");
  10. var _default = (0, _vue.defineComponent)({
  11. compatConfig: {
  12. MODE: 3
  13. },
  14. name: 'Portal',
  15. inheritAttrs: false,
  16. props: {
  17. getContainer: _vueTypes.default.func.isRequired,
  18. didUpdate: Function
  19. },
  20. setup: function setup(props, _ref) {
  21. var slots = _ref.slots;
  22. var isSSR = true;
  23. // getContainer 不会改变,不用响应式
  24. var container;
  25. var _useInjectPortal = (0, _context.useInjectPortal)(),
  26. shouldRender = _useInjectPortal.shouldRender;
  27. (0, _vue.onBeforeMount)(function () {
  28. isSSR = false;
  29. if (shouldRender.value) {
  30. container = props.getContainer();
  31. }
  32. });
  33. var stopWatch = (0, _vue.watch)(shouldRender, function () {
  34. if (shouldRender.value && !container) {
  35. container = props.getContainer();
  36. }
  37. if (container) {
  38. stopWatch();
  39. }
  40. });
  41. (0, _vue.onUpdated)(function () {
  42. (0, _vue.nextTick)(function () {
  43. if (shouldRender.value) {
  44. var _props$didUpdate;
  45. (_props$didUpdate = props.didUpdate) === null || _props$didUpdate === void 0 ? void 0 : _props$didUpdate.call(props, props);
  46. }
  47. });
  48. });
  49. (0, _vue.onBeforeUnmount)(function () {
  50. if (container && container.parentNode) {
  51. container.parentNode.removeChild(container);
  52. }
  53. });
  54. return function () {
  55. if (!shouldRender.value) return null;
  56. if (isSSR) {
  57. var _slots$default;
  58. return (_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
  59. }
  60. return container ? (0, _vue.createVNode)(_vue.Teleport, {
  61. "to": container
  62. }, slots) : null;
  63. };
  64. }
  65. });
  66. exports.default = _default;