ivue-material-plus/dist/unplugin-vue-components/es/utils/mixins/popper.mjs.map

A high quality UI components Library with Vue.js

{"version":3,"file":"popper.mjs","sources":["../../../../../src/utils/mixins/popper.ts"],"sourcesContent":["import { nextTick, defineComponent } from 'vue';\r\nimport { createPopper } from '@popperjs/core';\r\n\r\nexport default defineComponent({\r\n  emits: [\r\n    'on-popper-show',\r\n    'on-popper-hide',\r\n    'on-created',\r\n    'update:modelValue',\r\n  ],\r\n  props: {\r\n    reference: {\r\n      type: Object,\r\n    },\r\n    popper: {\r\n      type: Object,\r\n    },\r\n    /**\r\n     * 弹窗的展开方向\r\n     *\r\n     * @type {String}\r\n     */\r\n    placement: {\r\n      type: String,\r\n      default: 'bottom',\r\n    },\r\n    /**\r\n     * 箭头当前间距 左右 上下\r\n     *\r\n     * @type {Array}\r\n     */\r\n    offset: {\r\n      default: [0, 0],\r\n    },\r\n    /**\r\n     * 显示隐藏\r\n     *\r\n     * @type {Boolean}\r\n     */\r\n    modelValue: {\r\n      type: Boolean,\r\n      default: false,\r\n    },\r\n    /**\r\n     * 动画\r\n     *\r\n     * @type {String}\r\n     */\r\n    transition: String,\r\n    /**\r\n     * 默认选项\r\n     *\r\n     * @type {Object}\r\n     */\r\n    options: {\r\n      type: Object,\r\n      default() {\r\n        return {\r\n          modifiers: [\r\n            // 这决定了是否使用 GPU 加速样式来定位 popper\r\n            {\r\n              name: 'computeStyles',\r\n              options: {\r\n                gpuAcceleration: false, // true by default\r\n              },\r\n            },\r\n            //检测溢出\r\n            {\r\n              name: 'preventOverflow',\r\n              options: {\r\n                rootBoundary: 'viewport',\r\n              },\r\n            },\r\n          ],\r\n        };\r\n      },\r\n    },\r\n  },\r\n  // 在数据更改导致的虚拟 DOM 重新渲染和更新完毕之后被调用。\r\n  updated() {\r\n    nextTick(() => {\r\n      this.updatePopper();\r\n    });\r\n  },\r\n  // 销毁\r\n  beforeUnmount() {\r\n    if (this.popperJS) {\r\n      this.popperJS.destroy();\r\n    }\r\n  },\r\n  methods: {\r\n    // 创建pppper\r\n    createPopper() {\r\n      // 位置\r\n      if (!/^(top|bottom|left|right)(-start|-end)?$/g.test(this.placement)) {\r\n        return;\r\n      }\r\n\r\n      // 选项\r\n      const options = this.options;\r\n\r\n      // 节点\r\n      const popper = this.popper || this.$refs.popper;\r\n      // 参考位置\r\n      const reference = this.reference || this.$refs.reference;\r\n\r\n      if (!popper || !reference) return;\r\n\r\n      // 销毁\r\n      // eslint-disable-next-line no-prototype-builtins\r\n      if (this.popperJS && this.popperJS.hasOwnProperty('destroy')) {\r\n        this.popperJS.destroy();\r\n      }\r\n\r\n      // 方向\r\n      options.placement = this.placement;\r\n\r\n      // 箭头当前与参考重叠，我们可以使用修改器给它一个距离offset\r\n      if (!options.modifiers[3]) {\r\n        options.modifiers[3] = {\r\n          name: 'offset',\r\n          options: {\r\n            offset: this.offset,\r\n          },\r\n        };\r\n      }\r\n\r\n      // 创建\r\n      options.onFirstUpdate = () => {\r\n        nextTick(() => {\r\n          this.updatePopper();\r\n        });\r\n\r\n        this.$emit('on-created', this);\r\n      };\r\n\r\n      this.popperJS = createPopper(reference, popper, options);\r\n    },\r\n    // 更新\r\n    updatePopper() {\r\n      this.popperJS ? this.popperJS.update() : this.createPopper();\r\n    },\r\n    // 销毁\r\n    popperDestroy() {\r\n      // 显示\r\n      if (this.visible) {\r\n        return;\r\n      }\r\n\r\n      this.popperJS.destroy();\r\n      this.popperJS = null;\r\n    },\r\n  },\r\n  watch: {\r\n    // 显示隐藏\r\n    modelValue: {\r\n      immediate: true,\r\n      handler(val: boolean) {\r\n        this.visible = val;\r\n\r\n        this.$emit('update:modelValue', val);\r\n      },\r\n    },\r\n    // 显示隐藏\r\n    visible(value: boolean) {\r\n      // 显示\r\n      if (value) {\r\n        // 增加zIndex\r\n        if (this.handleIndexIncrease) {\r\n          this.handleIndexIncrease();\r\n        }\r\n\r\n        // 更新\r\n        this.updatePopper();\r\n\r\n        this.$emit('on-popper-show');\r\n      }\r\n      // 隐藏\r\n      else {\r\n        this.$emit('on-popper-hide');\r\n      }\r\n\r\n      // update\r\n      this.$emit('update:modelValue', value);\r\n    },\r\n  },\r\n});\r\n"],"names":[],"mappings":"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"}