html2canvas

//安装
npm install --save html2canvas
//导入
import html2canvas from 'html2canvas'
1.在template模板中
 
//methods 使用
methods: {
    // 页面元素转图片
    toImage() {
        // 第一个参数是需要生成截图的元素,第二个是自己需要配置的参数,宽高等
        return html2canvas(this.$refs.imageTofile, {
            backgroundColor: null, // 背景颜色
            dpi: 192, // 将分辨率提高到特定的dpi,默认值为96
            scale: 2, // 用于渲染的比例尺。默认为浏览器设备像素比率。默认值是1,手机端设置成2
            useCORS:true, // 是否尝试使用CORS从服务器加载图像
        }).then((canvas) => {
            this.posterUrl = canvas.toDataURL('image/png')//获取的图片地址
        })
    },
},

你可能感兴趣的:(html2canvas)