1. 程式人生 > >vue.js 二維碼生成組件

vue.js 二維碼生成組件

onf 引入 post data png 單位 res 大小 tab

安裝 通過NPM安裝
npm install vue-qart --save
插件應用 將vue-qart引入你的應用
import VueQArt from ‘vue-qart‘

new Vue({
    components: {VueQArt}
})
在你的應用中這樣使用vue-qart
<vue-q-art :config="config" :downloadButton="downloadButton"></vue-q-art>
data () {
    return {
        msg: ‘Welcome to Your Vue.js App‘,
        config: {
            value: ‘https://www.baidu.com‘,
            imagePath: ‘./examples/assets/logo.png‘,
            filter: ‘color‘
        },
        downloadButton: false
    }
}
組件參數
名稱類型默認值說明
value String - QR code表示的數據
imagePath String - 合並圖片的路徑
filter String threshold 定義一個圖像過濾器,threshold或者color
size Number 195 定義圖像的大小,單位是px
version Number 10 QR code版本 (1 <= version <= 40)
background String - 生成背景色
fillType String scale_to_fit 圖片放置類型(fill 或者 scale to fit)

vue.js 二維碼生成組件