html2canvas 转换html文本为图片

html2canvas方法只能转换HTMLElement对象，所以得创建一个

const canvasImage = async (html) => {
  // iframe的方式
  // var iframe = document.createElement('iframe');
  // document.body.append(iframe)
  // var iframedoc = iframe.contentDocument || iframe.contentWindow.document;
  // iframedoc.body.innerHTML = html
  // const canvas = await html2canvas(iframedoc.body.querySelector('#yawei'), {})
  // let imageUrl = canvas.toDataURL('image/png');
  // return imageUrl

  // div的方式
  var el = document.createElement('div')
  document.body.append(el)
  el.innerHTML = html
  const canvas = await html2canvas(el.querySelector('#yawei'), {})
  let imageUrl = canvas.toDataURL('image/png');
  return imageUrl
}

<img style="width: 150px;" :src="url">