关于javascript:HTML代码转canvas图标

用法:
1.装包: npm i html2canvas

2.导包: import html2canvas from 'html2canvas'

3.用包:

<template>  <div>    <div ref="box" class="box">      <h2>我是盒子</h2>      <p>        Lorem ipsum dolor sit amet consectetur adipisicing elit. Perferendis,        itaque aut. Est, nobis nisi, cum soluta pariatur labore modi minus        tempora porro optio quas quasi ut expedita, sequi aperiam maxime.      </p>    </div>    <img :src="src" alt="" />  </div></template><script>import html2canvas from 'html2canvas'export default {  data () {    return {      src: ''    }  },  mounted () {    html2canvas(this.$refs.box).then(canvas => {      const url = canvas.toDataURL()      console.log(url)      this.src = url    })  }}</script><style>.box {  background: linear-gradient(    to right,    red,    orange,    yellow,    green,    skyblue,    blue,    purple  );}.box h2 {  color: white;}img {  width: 100%;}</style>

对于html2canvas相干链接
npm-html2canvas:https://www.npmjs.com/package/html2canvas

简书 -html2canva2s:https://www.jianshu.com/p/abd9e9c5ba20

canvasAPI - toDataURL:https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLCanvasElement/toDataURL