vue2 pc端调起支付二维码qrcode

什么是 QRCode.js?

QRCode.js 是一个用于生成二维码的 JavaScript 库。主要是通过获取 DOM 的标签,再通过 HTML5 Canvas 绘制而成,不依赖任何库。

1.qrcode翻译过来就是二维码的意思

2.下载插件

npm i qrcode

<template>
	<div class="home">
		<canvas ref="canvas"></canvas>
		<button @click="add">支付(生成二维码)</button>
	</div>
</template>

<script>
import QRCode from 'qrcode'
export default {
	name: 'HomeView',
	data() {
		return {
			canvas: {},
		}
	},
	methods: {
		add() {
			// 后端返回的url放在这里,变成一张二维码,我在这里写的是百度的官网
			QRCode.toCanvas(
				this.$refs.canvas,
				'https://www.baidu.com/',
				function (error) {
					if (error) console.error(error)
					console.log('success!')
				}
			)
		},
	},
}
</script>

url的地址换成后端给的支付地址

猜你喜欢

转载自blog.csdn.net/m0_63873004/article/details/124458657