superman66 / Vue Qart
Licence: mit
the compoent of vue 2.x for qart.js
Stars: ✭ 298
Programming Languages
javascript
184084 projects - #8 most used programming language
Labels
Projects that are alternatives of or similar to Vue Qart
vuejs-uib-pagination
Best and complete pagination plugin for Vue.js. Inspired in Angular Bootstrap Pagination.
Stars: ✭ 58 (-80.54%)
Mutual labels: vuejs2
Vue Typed Js
Typed.js integration for vue.js. Create a typing animation.
Stars: ✭ 285 (-4.36%)
Mutual labels: vuejs2
Iview2 Management System
a basic management system example written by iview2.0 & Vue2.
Stars: ✭ 255 (-14.43%)
Mutual labels: vuejs2
Office Ui Fabric Vue
Office UI Fabric implementation for Vue.js
Stars: ✭ 273 (-8.39%)
Mutual labels: vuejs2
Vue Highlightjs
Syntax highlighting with highlight.js for Vue.js 2.x
Stars: ✭ 295 (-1.01%)
Mutual labels: vuejs2
Vuejs Component Style Guide
Vue.js Component Style Guide
Stars: ✭ 2,796 (+838.26%)
Mutual labels: vuejs2
Vuejs Serverside Template Xss
Demo of a Vue.js app that mixes both clientside templates and serverside templates leading to an XSS vulnerability
Stars: ✭ 278 (-6.71%)
Mutual labels: vuejs2
Vue Home
🏠 A simple project(Vue Community SPA) which bases on vue+vue-cli+vue-router+axios+ scss.
Stars: ✭ 256 (-14.09%)
Mutual labels: vuejs2
Vue Form Generator
📋 A schema-based form generator component for Vue.js
Stars: ✭ 2,853 (+857.38%)
Mutual labels: vuejs2
Vuejs Firebase Shopping Cart
Shopping cart demo using Vuejs and Firebase
Stars: ✭ 274 (-8.05%)
Mutual labels: vuejs2
Draggable Vue Directive
Vue2 directive that handles drag & drop
Stars: ✭ 286 (-4.03%)
Mutual labels: vuejs2
Formvuelar
Vue form components with server-side validation in mind
Stars: ✭ 263 (-11.74%)
Mutual labels: vuejs2
Paascloud Mall Web
模拟商城,完整的购物流程、后端运营平台,使用 spring cloud + vue 全家桶实现快速搭建企业级微服务项目
Stars: ✭ 287 (-3.69%)
Mutual labels: vuejs2
Mui Vue2
mui+mint+vue2.x+vue-router+vuex+webpack最终打包成原生apk的app项目,样式使用vue移动端mint ui框架,原生手机能力偏重于mui框架,欢迎star!
Stars: ✭ 278 (-6.71%)
Mutual labels: vuejs2
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
import VueQArt from 'vue-qart'
new Vue({
components: {VueQArt}
})
Usage
In template
<vue-q-art :config="config"></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'
}
}
}
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.$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
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].