【uniapp-如何生成二维码超详细】

一、第一步

(1) 首先需要创建一个js文件，名字为 uqrcode.js , 名字随意;

(2) 在你需要的页引入 uqrcode.js文件，到这里都成功了一半；

(3) 温馨提示: 二维码呢是需要在 画布(canvas) 里边展示的，接下来先需要一个画布

(4) 然后在methods方法里边定义一个函数方法；

onLoad(option) {
   
			console.log(this.obj,123)
			this.qrFun(option.qljyAdvertisementEnrollEntity.adMark)
		},
		methods: {
   
       qrFun: function(text) {
   
				UQrcode.make({
   
					canvasId: 'qrcode',   //切记canvasId 里边的内容需要跟canvas里边canvas-id="qrcode"的名字一样
					componentInstance: this,
					text: text,  //需要转成二维码的内容是后端传过来的，我这里是onLoad传过来的，根                              据自己的需要
					size: 150,
					margin: 0,
					backgroundColor: '#ffffff',
					foregroundColor: '#000000',
					fileType: 'jpg',
					errorCorrectLevel: UQrcode.errorCorrectLevel.H,
					success: res => {
   }
				})
			},
	}

二级目录

三、uqrcode.js 原码

// uqrcode.js
//---------------------------------------------------------------------
// github https://github.com/Sansnn/uQRCode
//---------------------------------------------------------------------

let uQRCode = {
   };

(function() {
   
	//---------------------------------------------------------------------
	// QRCode for JavaScript
	//
	// Copyright (c) 2009 Kazuhiko Arase
	//
	// URL: http://www.d-project.com/
	//
	// Licensed under the MIT license:
	//   http://www.opensource.org/licenses/mit-license.php
	//
	// The word "QR Code" is registered trademark of 
	// DENSO WAVE INCORPORATED
	//   http://www.denso-wave.com/qrcode/faqpatent-e.html
	//
	//---------------------------------------------------------------------

	//---------------------------------------------------------------------
	// QR8bitByte
	//---------------------------------------------------------------------

	function QR8bitByte(data) {
   
		this.mode = QRMode.MODE_8BIT_BYTE;
		this.data = data;
	}

	QR8bitByte.prototype = {
   

		getLength: function(buffer) {
   
			return this.data.length;
		},

		write: function(buffer) {
   
			for (var i = 0; i < this.data.length; i++) {
   
				// not JIS ...
				buffer.put(this.data.charCodeAt(i), 8);
			}
		}
	};

	//---------------------------------------------------------------------
	// QRCode
	//---------------------------------------------------------------------

	function QRCode(typeNumber, errorCorrectLevel) {
   
		this.typeNumber = typeNumber;
		this.errorCorrectLevel = errorCorrectLevel;
		this.modules = null;
		this.moduleCount = 0;
		this.dataCache = null;
		this.dataList = new Array();
	}

	QRCode.prototype = {
   

		addData: function(data) {
   
			var newData = new QR8bitByte(data);
			this.dataList.push(newData);
			this.dataCache = null;
		},

		isDark: function(row, col) {
   
			if (row < 0 || this.moduleCount <= row || col < 0 || this.moduleCount <= col) {
   
				throw new Error(row + "," + col);
			}
			return this.modules[row][col];
		},

		getModuleCount: function() {
   
			return this.moduleCount;
		},

		make: function() {
   
			// Calculate automatically typeNumber if provided is < 1
			if (this.typeNumber < 1) {
   
				var typeNumber = 1;
				for (typeNumber = 1; typeNumber < 40; typeNumber++) {
   
					var rsBlocks = QRRSBlock.getRSBlocks(typeNumber, this.errorCorrectLevel);

					var buffer = new QRBitBuffer();
					var totalDataCount = 0;
					for (var i = 0; i < rsBlocks.length; i++) {
   
						totalDataCount += rsBlocks[i].dataCount;
					}

					for (var i = 0; i < this.dataList.length; i++) {
   
						var data = this.dataList[i];
						buffer.put(data.mode, 4);
						buffer.put(data.getLength(), QRUtil.getLengthInBits(data.mode, typeNumber));
						data.write(buffer);
					}
					if (buffer.getLengthInBits() <= totalDataCount * 8)
						break;
				}
				this.typeNumber = typeNumber;
			}
			this.makeImpl(false, this.getBestMaskPattern());
		},

		makeImpl: function(test, maskPattern) {
   

			this.moduleCount = this.typeNumber * 4 + 17;
			this.modules = new Array(this.moduleCount);

			for (var row = 0; row < this.moduleCount; row++) {
   

				this.modules[row] = new Array(this.moduleCount);

				for (var col = 0; col < this.moduleCount; col++) {
   
					this.modules[row][col] = null; //(col + row) % 3;
				}
			}

			this.setupPositionProbePattern(0, 0);
			this.setupPositionProbePattern(this.moduleCount - 7, 0);
			this.setupPositionProbePattern(0, this.moduleCount - 7);
			this.setupPositionAdjustPattern();
			this.setupTimingPattern();
			this.setupTypeInfo(test, maskPattern);

			if (this.typeNumber >= 7) {
   
				this.setupTypeNumber(test);
			}

			if (this.dataCache == null) {
   
				this.dataCache = QRCode.createData(this.typeNumber, this.errorCorrectLevel, this.dataList);
			}

			this.mapData(this.dataCache, maskPattern);
		},

		setupPositionProbePattern: function(row, col) {
   

			for (var r = -1; r <= 7; r++) {
   

				if (row + r <= -1 || this.moduleCount <= row + r) continue;

				for (var c = -1; c <= 7; c++) {
   

					if (col + c <= -1 || this.moduleCount <= col + c) continue;

					if ((0 <= r && r <= 6 && (c == 0 || c == 6)) ||
						(0 <= c && c <= 6 && (r == 0 || r == 6)) ||
						(2 <= r && r <= 4 && 2 <= c && c <= 4)) {
   
						this.modules[row + r][col + c] = true;
					} else {
   
						this.modules[row + r][col + c] = false;
					}
				}
			}
		},

		getBestMaskPattern: function() {
   

			var minLostPoint = 0;
			var pattern = 0;

			for (var i = 0; i < 8; i++) {
   

				this.makeImpl(true, i);

				var lostPoint = QRUtil.getLostPoint(this);

				if (i == 0 || minLostPoint > lostPoint) {
   
					minLostPoint = lostPoint;
					pattern = i;
				}
			}

			return pattern;
		},

		createMovieClip: function(target_mc, instance_name, depth) {
   

			var qr_mc = target_mc.createEmptyMovieClip(instance_name, depth);
			var cs = 1;

			this.make();

			for (var row = 0; row < this.modules.length; row++) {
   

				var y = row * cs;

				for (var col = 0; col < this.modules[row].length; col++) {
   

					var x = col * cs;
					var dark = this.modules[row][col];

					if (dark) {
   
						qr_mc.beginFill(0, 100);
						qr_mc.moveTo(x, y);
						qr_mc.lineTo(x + cs, y);
						qr_mc.lineTo(x + cs, y + cs);
						qr_mc.lineTo(x, y + cs);
						qr_mc.endFill();
					}
				}
			}

			return qr_mc;
		},

		setupTimingPattern: function() {
   

			for (var r = 8; r < this.moduleCount - 8; r++) {
   
				if (this.modules[r][6] != null) {
   
					continue;
				}
				this.modules[r][6] = (r % 2 == 0);
			}

			for (var c = 8; c < this.moduleCount - 8; c++) {
   
				if (this.modules[6][c] != null) {
   
					continue;
				}
				this.modules[6][c] = (c % 2 == 0);
			}
		},

		setupPositionAdjustPattern: function() {
   

			var pos = QRUtil.getPatternPosition(this.typeNumber);

			for (var i = 0; i < pos.length; i++) {
   

				for (var j = 0; j < pos.length; j++) {
   

					var row = pos[i];
					var col = pos[j];

					if (this.modules[row][col] != null) {
   
						continue;
					}

					for (var r = -2; r <= 2; r++) {
   

						for (var c = -2; c <= 2; c++) {
   

							if (r == -2 || r == 2 || c == -2 || c == 2 ||
								(r == 0 && c == 0)) {
   
								this.modules[row + r][col + c] = true;
							} else {
   
								this.modules[row + r][col + c] = false;
							}
						}
					}
				}
			}
		},

		setupTypeNumber: function(test) {
   

			var bits = QRUtil.getBCHTypeNumber(this.typeNumber);

			for (var i = 0; i < 18; i++) {
   
				var mod = (!test && ((bits >> i) & 1) == 1);
				this.modules[Math.floor(i / 3)][i % 3 + this.moduleCount - 8 - 3] = mod;
			}

			for (var i = 0; i < 18; i++) {
				var mod = (!test && ((bits >> i) & 1) == 1);
				this.modules[i % 3 + this.moduleCount - 8 - 3][Math.floor(i / 3)] = mod;
			}
		},

		setupTypeInfo: function(test, maskPattern) {

			var data = (this.errorCorrectLevel << 3) | maskPattern;
			var bits = QRUtil.getBCHTypeInfo(data);

			// vertical		
			for (var i = 0; i < 15; i++) {

				var mod = (!test && ((bits >> i) & 1) == 1);

				if (i < 6) {
					this.modules[i][8] = mod;
				} else if (i < 8) {
					this.modules[i + 1][8] = mod;
				} else {
					this.modules[this.moduleCount -