当前位置:   article > 正文

vue 截图转base64转文件File 异步获取

vue 截图转base64转文件File 异步获取
  1. import html2canvas from "html2canvas";
  2. export function base64ImgtoFile(dataurl, filename = 'file') {
  3. let arr = dataurl.split(',')
  4. let mime = arr[0].match(/:(.*?);/)[1]
  5. let suffix = mime.split('/')[1]
  6. let bstr = atob(arr[1])
  7. let n = bstr.length
  8. let u8arr = new Uint8Array(n)
  9. while (n--) {
  10. u8arr[n] = bstr.charCodeAt(n)
  11. }
  12. return new File([u8arr], `${filename}.${suffix}`, {
  13. type: mime
  14. })
  15. }
  16. export function toImages(imageTofile) {
  17. return new Promise((resolve, reject) => {
  18. html2canvas(imageTofile, {
  19. backgroundColor: null,
  20. useCORS: true
  21. }).then((canvas) => {
  22. const url = canvas.toDataURL('image/png');
  23. resolve(base64ImgtoFile(url))
  24. }).catch((err) => {
  25. reject(err)
  26. })
  27. })
  28. }

// 调用  

  toImage() {

      let that=this;

       toImages(this.$refs.imageTofile).then((imgFileRaw) => {

      that.imgFileRaw = base64ImgtoFile(this.htmlUrl);

    }).catch((error) => {

      that.imgFileRaw = null;

    });

    },

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/很楠不爱3/article/detail/174619?site
推荐阅读
相关标签
  

闽ICP备14008679号