1.0.1 • Published 6 years ago
vue-logo-qrcode
安装
npm install @njshaoshao/vue-logo-qrcode
使用示例
<template>
<div id="app">
<vueLogoQrcode ref="qrcode"
:content="content"
:width="width"
:autoGen="true"
@click.native="downloadImage"></vueLogoQrcode>
</div>
</template>
<script>
import vueLogoQrcode from '@njshaoshao/vue-logo-qrcode';
export default {
name: 'app',
components: { vueLogoQrcode },
data() {
return {
content: "shaojiasong",
width: 200
}
},
methods: {
downloadImage() {
this.$refs.qrcode.genQrCodeImageDownload();
}
}
}
</script>
<style lang="scss">
</style>
参数介绍
参数 | 说明 | 默认值 |
---|
content | 二维码内容 | '' |
width | 二维码图片大小 | 100 |
logoSrc | logo url (跨域会有问题) | 一个vue的logo |
logoRadius | logo 的圆角 | 8 |
autoGen | 是否监听 参数变化 | false |
showImmediately | 是否立即显示 | true |
mode | image/canvas 选择 | image |
方法介绍
方法名 | 说明 |
---|
genQrCode | 生成二维码 |
genQrCodeImageDownload | 下载二维码图片 |
开发进度
本地运行(fork下来自己玩)
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build