组件用.vue还是.js_适用于qart.js的vue 2.x的组件-CSDN博客

组件用.vue还是.js

Vue-Qart (vue-qart)

You should read it before you using vue-qart

在使用vue-qart之前，您应该阅读它

现场演示 (Live Demo)

https://chenhuichao.com/vue-qart/demo/

安装 (Installation)

install with NPM

用NPM安装

npm install vue-qart --save

Import

进口

import VueQArt from 'vue-qart'

new Vue({
    components: {VueQArt}
})

用法 (Usage)

In template

在模板中

<vue-q-art :config="config" :downloadButton="downloadButton"></vue-q-art>

Set config value

设置配置值

data () {
    return {
        msg: 'Welcome to Your Vue.js App',
        config: {
            value: 'https://www.baidu.com',
            imagePath: './examples/assets/logo.png',
            filter: 'color'
        },
        downloadButton: false
    }
}

downloadButton whether display donwload button.
downloadButton是否显示downloadButton按钮。

For more details you should definitely check out
有关更多详细信息，请务必查看
qart.js
qart.js

download to image

下载到图片

you can download the qrcode to image by using canvas.toDataURL()

您可以使用canvas.toDataURL()将canvas.toDataURL()下载到图像上

const myCanvas = this.$refs.qart.children[0];
const type = 'image/png';
let image = myCanvas.toDataURL(type).replace(type, "image/octet-stream");
window.location.href = image; // it will save locally

构建设置 (Build Setup)

# install dependencies
npm install

# serve with hot reload at localhost:8080/demo/
npm run dev

# build demo 
npm run demo

# export the directive as a library
npm run build