@fe6/water-pro/es/scrollbar/dom-wap.js

An enterprise-class UI design language and Vue-based implementation

import { createVNode as _createVNode } from "vue";
import { defineComponent } from 'vue';
import PropTypes from '../_util/vue-types';
import ResizeObserver from 'resize-observer-polyfill';
import { getSlot, findDOMNode } from '../_util/props-util';
var DOMWrap = defineComponent({
  name: 'DOMWrap',
  emits: ['update-dom'],
  setup: function setup(_, _ref) {
    var emit = _ref.emit;
    return {
      theUpdate: function theUpdate() {
        emit('update-dom');
      }
    };
  },
  data: function data() {
    this.resizeObserver = null;
    this.mutationObserver = null;
    return {
      lastVisibleIndex: undefined
    };
  },
  mounted: function mounted() {
    var _this = this;

    this.$nextTick(function () {
      _this.theUpdate();

      var menuUl = findDOMNode(_this);

      if (!menuUl) {
        return;
      }

      _this.resizeObserver = new ResizeObserver(function (entries) {
        entries.forEach(_this.theUpdate);
      });
      [].slice.call(menuUl.children).concat(menuUl).forEach(function (el) {
        _this.resizeObserver.observe(el);
      });

      if (typeof MutationObserver !== 'undefined') {
        _this.mutationObserver = new MutationObserver(function () {
          _this.resizeObserver.disconnect();

          [].slice.call(menuUl.children).concat(menuUl).forEach(function (el) {
            _this.resizeObserver.observe(el);
          });

          _this.theUpdate();
        });

        _this.mutationObserver.observe(menuUl, {
          attributes: false,
          childList: true,
          subTree: false
        });
      }
    });
  },
  beforeUnmount: function beforeUnmount() {
    if (this.resizeObserver) {
      this.resizeObserver.disconnect();
    }

    if (this.mutationObserver) {
      this.mutationObserver.disconnect();
    }
  },
  render: function render() {
    return _createVNode("div", null, [getSlot(this)]);
  }
});
DOMWrap.props = {
  onUpdateDom: PropTypes.func.def(function () {})
};
export default DOMWrap;