<template>
	<img :src="test(teacher.image, 2.2)" alt /> // 宽度单位为rem，也可以用其他单位
</template>
 
<script>
test(url, width) {
      let dpr = window.devicePixelRatio;   // 获取dpr
      let fontSize = parseFloat(document.documentElement.style.fontSize);

      let _url = url.split("?")[0];
      let _width = Math.ceil(fontSize * width * dpr);
      _url  = `?x-oss-process=image/resize,w_${_width}`;
      return _url;
    }
</script>
 

<template>
	<img :data-src="item.image" alt />
</template>

<script>
updated() {
    this.$nextTick(() => {
      let $imgList = document.querySelectorAll("img");
      let length = $imgList.length;
      for (var i = 0; i < length; i  ) {
        let current = $imgList[i];
        if (!$imgList.src) {
          let dataSrc = current.dataset.src.split("?")[0];
          let width = current.width;
          let dpr = window.devicePixelRatio;
          let _width = Math.ceil(width * dpr);
          current.src =
            dataSrc   `?x-oss-process=image/resize,w_${_width}`;
        }
      }
    });
  }
</script>