vue指令获取dom高度

48 阅读1分钟
 <div class="overflowBox" v-resize="handleResize" ref="overflowBox" />

handleResize({ width, height }) {
      let heights = height.split(".")[0];
      console.log("height", heights.split("p")[0]);
    },
    
     let div = this.$refs.overflowBox;
      this.$nextTick(() => {
        div.scrollTop = div.scrollHeight; // 最后一项,滚动条自动滚动到数据的最后一项
      });
export const resize = {
  inserted(el, binding) {
    let width = "",
      height = "";
    function isReize() {
      const style = document.defaultView.getComputedStyle(el);
      if (width !== style.width || height !== style.height) {
        // 关键(这传入的是函数,所以执行此函数)
        binding.value({ width: style.width, height: style.height });
      }
      width = style.width;
      height = style.height;
    }
    el.__vueSetInterval__ = setInterval(isReize, 300);
  },

  unbind(el) {
    // console.log(el, '解绑')
    clearInterval(el.__vueSetInterval__);
  },
};