vue-qart
You should read it before you using vue-qart
because of qart.js's author doesn't publish the lastest version to npm. so, the new options
size
,version
,background
,fillType
doesn't work in vue-qart until qart.js' author publish the lastest version.
For More Detail, seeing this issue: size option doesn't works
the Vue 2.x Component for kciter's qart.js
Check the DEMO
Installation
install with NPM
npm install vue-qart --save
Import
components: VueQArt
Usage
In template
Set config value
{ return msg: 'Welcome to Your Vue.js App' config: value: 'https://www.baidu.com' imagePath: './examples/assets/logo.png' filter: 'color' }
for imagePath prop, you can use base64 instead of image path.
For more details you should definitely check out qart.js
download to image
passing download
props, to show download button, it support:
- text - button text
- visible - setting download button visible or not
- style - setting download button style
- type - image type,such as
image/png
- filename
you can download the qrcode to image by using canvas.toDataURL()
const myCanvas = this$refsqartchildren0;const type = 'image/png';let image = myCanvas;windowlocationhref = 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