vue把图片image转为base64格式

这个方法是写成了一个全局方法、用that.$getBase64Image(image)调用,如需单独使用也可以单独在页面中写成一个方法来调用

   /**
     * 把图片转为base64格式
     * 使用方法如下
     * let url = this.$url + 图片地址;
     * let image = new Image();
     * let that = this;
     * image.crossOrigin = '';
     * image.src = url;
     * image.onload = function () {
     * let base64 = that.$getBase64Image(image);
     * base64就是转换后得到的格式,直接可以赋值给其他数据(调用that)
     * }
     */
    Vue.prototype.$getBase64Image = img => {
      var canvas = document.createElement("canvas");
      canvas.width = img.width;
      canvas.height = img.height;
      var ctx = canvas.getContext("2d");
      ctx.drawImage(img, 0, 0, img.width, img.height);
      var ext = img.src.substring(img.src.lastIndexOf(".") + 1).toLowerCase();
      var dataURL = canvas.toDataURL("image/" + ext);
      return dataURL;
    };

你可能感兴趣的:(VUE技术)