溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本篇內容主要講解“Vue使用vue-qr生成二維碼的方法是什么”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“Vue使用vue-qr生成二維碼的方法是什么”吧!
“二維碼”的英文是“QR Code”，“QR”是“Quick Response”的縮寫，反映出這種二維碼具有“超高速識讀”的特點。“Quick Response Code”也就是“快速響應碼”。
npm install vue-qr --save
下載成功：
import VueQr from 'vue-qr'
text 二維碼，即掃描二維碼后跳轉的頁面
size 二維碼大小
margin 二維碼圖像的外邊距, 默認 20px
bgSrc 嵌入的背景圖地址
logoSrc 嵌入至二維碼中心的 LOGO 地址
logoScale 中間圖的尺寸
dotScale 二維碼的點的大小
colorDark 實點的顏色（注意：和colorLight一起設置才有效）
colorLight 空白的顏色（注意：和colorDark一起設置才有效）
autoColor 若為 true, 背景圖的主要顏色將作為實點的顏色, 即 colorDark,默認 true
<template>
<div>
<vue-qr
:text="imgUrl"
:size="250"
:logoSrc="logo"
:logoScale="0.2">
</vue-qr>
</div>
</template>
<script>
import VueQr from 'vue-qr'
export default {
name:'',
components:{
VueQr,
},
data() {
return {
imgUrl: 'https://baidu.com',
logo: require('@/assets/tea_128.png'),
}
},
methods:{
},
}
</script>到此，相信大家對“Vue使用vue-qr生成二維碼的方法是什么”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
