Vue项目中获取图片的 缩放后的width和height

场景 : 图片 自适应不同显示器 width : 100%

场景二 : 图片上 定位了一个导航, 要与图片缩放大小 的 height 同步

思路: 获取图片变化的height 给 nav 导航

解决:

步骤二 图片加载函数 获取图片高度

 img_load() {
      var _test = document.getElementById('test') //若是jq，则直接将此代码换成 var _test = $("#test"); 即可。
      this.$nextTick(() => {
        this.img_height = _test.clientHeight
      })
    },

步骤三 将高度height 同步给 导航 nav

步骤四 不同的 显示器切换时 nav 加载一次后 不再变化

监听屏幕宽度变化 再去给 height 赋值 新的图片高度

注销window.onresize事件

  destroyed() {
    window.onresize = null
  },