h5页面如何生成二维码_js 根据内容 生成二维码

h5页面如何生成二维码_js 根据内容 生成二维码uniapp,vue皆可使用首先去下载qrcode.js链接可以在根目录中新建utils文件夹,把下载的js放进去)1.引入js并创建data变量importqrcodefrom’@/utils/qrcode.js’data(){ return{ url:””, qrcodeURL:”” } }, methods:{ //生成url二维满 creatQrCode(){ this.url=window.location.h

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

uniapp,vue皆可使用

首先去下载qrcode.js 链接 可以在根目录中新建utils文件夹,把下载的js放进去)

1.引入js 并创建data变量

import qrcode from '@/utils/qrcode.js'
data() {
			return {
				url: "",
				qrcodeURL: ""
			}
		},

	methods: {
	//生成url二维满
			creatQrCode(){
			this.url = window.location.href  //获取当前页面链接url
			// this.url = 'https://stbzmall.oss-cn-guangzhou.aliyuncs.com/apk/youfenqi.apk?		versionId=CAEQDBiBgMD3xI_R2RciIGNiYzQzYmM2NjRiYzQ5MmViMjJkMDU3MmM2MDA3NmM3'
			let params = this.url; // 二维码参数
			var imgData = qrcode.drawImg(params, {
				typeNumber: 4, // 密度
				errorCorrectLevel: 'L', // 纠错等级
				size: 800, // 白色边框
			})
			this.qrcodeURL = imgData 
			},

}

2.页面使用

<view  class="qrcode_img" >
	<img :src="qrcodeURL" mode="aspectFit"></img>
</view>


<style>
// 二维码
	.qrcode_img {
		width: 200px;
		height: 200px;
		display: flex;
		justify-content: center;
		margin: 0 auto;
		img {
			width: 800px;
			height: 200px;
		}
	}
</style>
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/189501.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • Ext4文件系统fsck后损坏修复方法-linux数据恢复案例[通俗易懂]

    Ext4文件系统fsck后损坏修复方法-linux数据恢复案例[通俗易懂]在数据恢复案例开始之前有几个概念需要了解块组:Ext4文件系统的全部空间被划分为若干个块组,每个块组内的结构都是大致相同的。块组描述符表:每个块组都对应一个块组描述符,这些块组描述符统一放在文件系统的前部,称为块组描述符表。每个块组描述符大小为32字节,其主要描述块位图、i-节点位图及i-节点表的地址等信息。超级块(Superblock):用于存储文件系统的配置参数(如块大小、总块数、i-节点数…

    2022年5月25日
  • getElementById 方法及用法

    getElementById 方法及用法[转]顾明思义,get-Element-By-Id,就是通过ID来设置/返回HTML标签的属性及调用其事件与方法。用这个方法基本上可以控制页面所有标签,条件很简单就是给每个标签分配一个ID号:document.getElementById(“link”).href;document.getElementById(“link”).target;document.getElementById(“i

    2022年7月15日
  • 什么是 Hook 技术

    什么是 Hook 技术一、什么是Hook技术  Hook技术又叫做钩子函数,在系统没有调用该函数之前,钩子程序就先捕获该消息,钩子函数先得到控制权,这时钩子函数既可以加工处理(改变)该函数的执行行为,还可以强制结束消息的传递。简单来说,就是把系统的程序拉出来变成我们自己执行代码片段。  要实现钩子函数,有两个步骤:  1.利用系统内部提供的接口,通过实现该接口,然后注入进系统(特定场景下使用)  2.动态代理(使用所有场景)二、Hook技术实现的步骤  Hook技术实现的步骤也分为两步  1.找到ho

    2022年5月13日
  • random.nextInt()的值重复

    random.nextInt()的值重复1、当random.netInt(数字)中数字小的时候,比较容易重复。这个随机是有规律的。2、可以用math.random()替代具体使用如下:如果是个位数intaa=(int)(Math.random()*11);如果是多位,doubledd=Math.random();  dd加上0和点总共19位。可以用long转一下…

    2022年7月21日
  • pycharm如何配置git_idea怎么配置git

    pycharm如何配置git_idea怎么配置gitPycharm配置git环境在网上查了一些发现都已经过时了,有的根本没办法用,自己摸索了一下午。捣鼓的差不多了至少可以用hhhh默认各位老铁都已经安装好了,Git咯,并且有自己的github网址或者gitee网站咯0X1创建一个新项目首先新键一个新的项目,直接creat就好了创建好了如下:0X2匹配GitFile->Settings->VersionControl->Git详情如下:找到Setting,点击进入找到VersionControl,

    2022年8月26日
  • 安装CLOVER引导器到硬盘EFI分区

    彻底脱离CLOVER引导U盘目录:1使用EFITOOLSClover安装CLOVER引导器到EFI分区。2使用Cloverv2.3krXXXX.pkg安装CLOVER引导器到EFI分区前言我们的电脑里已经安装好了双系统,但是之前都是通过启动CLOVER引导U盘进行引导双系统的。本章节内容,将简单的介绍将在MAC系统(=OSX系统)下将CLOVER引导器安装到硬盘EFI分区。…

    2022年4月7日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号