uniapp 微信小程序小票打印机打印教程(超详细讲解) 完整代码,下载后可直接使用

天梦星官网 (tmxkj.top)https://tmxkj.top/#/  编程资源

直接上代码:

           ly_text:"点击搜索",
		   connected_ly:false,//蓝牙按钮是否显示
	       blue_list_ly:false,//蓝牙连接列表显示
           discoveryStarted: false,
		   devices: [],//设备列表
	    	name: '',
	    	deviceId: '',
	       chs: [],
	    	canWrite: false,
	
/**
			 * 第一步
			 * @param {打开蓝牙}
			 * @param {搜索}
			 */
			openBluetoothAdapter() {
				if (!wx.openBluetoothAdapter) {
					wx.showModal({
						title: '提示',
						content: '当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试。'
					})
					return
				}
				/**
				 * 初始化蓝牙模块
				 */
			this.openBluetoothAdapters()
			},
			/**
			 * 第二步
			 * @param {初始化蓝牙模块}  
			 * @param {请求打开蓝牙}
			 */
			openBluetoothAdapters() {
				this.ly_text="搜索设备中"
				uni.openBluetoothAdapter({//请求打开蓝牙情况
					success: (res) => {
						this.startBluetoothDevicesDiscovery();//打开蓝牙后 开始搜索
					},
					fail: (err) => {
						if (err.errCode === 10001) {
							uni.showModal({
								title: '错误',
								content: '未找到蓝牙设备,请打开蓝牙重试!',
								showCancel: false
							});
							uni.onBluetoothAdapterStateChange(res => {
								console.log('请求打开蓝牙失败再次请求', res);
								if (res.available) {
									uni.onBluetoothAdapterStateChange(() => {});
									this.startBluetoothDevicesDiscovery();
								}
							})
						}
					}
				});
			},
			/**
			 * 第三步
			 * @param {开始搜寻附近的蓝牙外围设备}  
			 */		
			startBluetoothDevicesDiscovery() {
				this.discoveryStarted = true
				uni.startBluetoothDevicesDiscovery({
					success: (res) => {
						this.onBluetoothDeviceFound();//蓝牙搜索成功后监听搜索
					},
					fail: (res) => {
						console.log('搜索蓝牙失败', res)
					}
				})
			 },
			
			/**
			 * 第四步
			 * @param {监听寻找到新设备的事件} 
			 * @param {最终得到最后的蓝牙连接列表}
			 * @param {搜素事件到此结束}
			 */
			onBluetoothDeviceFound() {
				uni.onBluetoothDeviceFound(res => {
					//res:发现的设备列表
					res.devices.forEach(device => {
						if (!device.name && !device.localName) {
							return
						}
						let foundDevices = this.devices;
						let idx = this.inArray(foundDevices, 'deviceId', device.deviceId);
						let data = {};
						if (idx === -1) {
							this.devices.push(device);
						} else {
							this.devices[index] = device;
						}
					})
					if(this.devices.length>=1){
						this.blue_list_ly=true;
						this.ly_text="发现设备"
					}else{
						// uni.showToast({
						// 	title:'暂无搜索内容',
						// 	icon:'error'
						// })
						this.ly_text="未发现设备"
					}
					console.log('发现的设备列表:', this.devices);
				})
			},
			/**
			 * 第五步
			 * @param {手动点击连接蓝牙事件}
			 * @param {创建连接蓝牙}
			 * @param {如果已经连接过可直接连接}
			 */			
			_createBLEConnection(e) {
				uni.createBLEConnection({
					deviceId:e.deviceId,
					success: (res) => {
						this.blue_list_ly=false;
						this.connected_ly=true;
						this.ly_text="已连接";
						this.name = e.name;
						this.deviceId =e.deviceId;
						//获取蓝牙
						this.getBLEDeviceServices(e.deviceId);
						uni.setStorage({
							key: LAST_CONNECTED_DEVICE,
							data: {
								name:e.name,
								deviceId:e.deviceId
							}
						})
					},
					fail: (err) => {
						this.connected_ly =false;
						this.ly_text="连接失败";
					}
				})
				this.stopBluetoothDevicesDiscovery();
			},				
			/**
			 * 第六步
			 * @param {蓝牙连接成功关闭监听搜索}
			 * @param {蓝牙搜索比较消耗资源}
			 */	
		    stopBluetoothDevicesDiscovery() {
		    	wx.stopBluetoothDevicesDiscovery({
		    		complete: () => {
		    			console.log('停')
		    			this.discoveryStarted = false
		    		}
		    	})
		    },
			/**
			 * 第七步
			 * @param {蓝牙连接成功关闭搜索}
			 * @param {功能}
			 */	
			closeBLEConnection(e) {
				uni.closeBLEConnection({
					deviceId: e.deviceId
				})
			   this.connected_ly=false;
			},
			/**
			 * 第八步
			 * @param {蓝牙功能查询}
			 * @param {蓝牙连接成功后}
			 * @param {找到主要服务功能}
			 */	
			getBLEDeviceServices(deviceId) {
				uni.getBLEDeviceServices({
					deviceId,
					success: (res) => {
						for (let i = 0; i < res.services?.length; i++) {
							if (res.services[i].isPrimary) {
								this.getBLEDeviceCharacteristics(deviceId, res.services[i].uuid);
								return
							}
						}
					}
				})
			},
			/**
			 * 第九步
			 * @param {蓝牙功能特征查询}
			 * @param {主要功能的特性}
			 * @param {找到主要服务功能的特征}
			 * @param {到此步骤连接结束}
			 */	
			getBLEDeviceCharacteristics(deviceId, serviceId) {
				uni.getBLEDeviceCharacteristics({
					deviceId,
					serviceId,
					success: (res) => {
						for (let i = 0; i < res.characteristics?.length; i++) {
							const item = res.characteristics[i]
							if (item.properties.write) {
								this.canWrite = true;
								this._deviceId = deviceId
								this._serviceId = serviceId
								this._characteristicId = item.uuid
							   uni.setStorage({
							   	key: "BlueKey",
							   	data: {
									_close:true,
									_name:this.name,
									_deviceId : deviceId,
									_serviceId : serviceId,
									_characteristicId : item.uuid,
							   	}
							   })
								break;
							}
						}
						setTimeout(()=>{
							if (this.canWrite) {
							  this.connected_ly=true;
							  this.ly_text="已连接"
						} else {
							uni.showToast({
								icon: 'error',
								title: '您当前选择的设备不支持打印功能,请重新选择!',
								duration: 3000
							})
						}
						},1000)
					},
					fail: (res) => {
						console.error('获取蓝牙特征失败', res)
					}
				})
			},
			/**
			 * 第十步
			 * @param {编写蓝牙需要打印的内容}
			 * @param {打印按钮的事件}
			 * @param {打印功能前准备}
			 */	
			writeBLECharacteristicValue() {
			   var that=this
		     	setTimeout(() => {
				let printerJobs = new PrinterJobs();
				let dayun1 = '当事人 (单位):' + this.listObj?.contactinfo?.client + '\r\n' +
							'被处罚人姓名:' + this.listObj?.contactinfo?.name + '\r\n' +
							'被处罚人性别:' + this.listObj?.contactinfo?.sex + '\r\n' +
							'被处罚人联系方式:' + this.listObj?.contactinfo?.iPhone + '\r\n' +
							'被处罚人身份证号码:' + this.listObj?.contactinfo?.idcard + '\r\n' 
							
				printerJobs
					.setSize(2, 2)
					.setAlign('CT')
					.print('! 0 100 203 100 1\r\n法决定书\r\nPRINT\r\n')
					.setSize(1, 1).setAlign('LT')
					.print(dayun1)
				
			
			
				let buffer = printerJobs.buffer();
				// console.log('ArrayBuffer', 'length: ' + buffer.byteLength, ' hex: ' + this.ab2hex(
				// 	buffer));
				// 1.并行调用多次会存在写失败的可能性
				// 2.建议每次写入不超过20字节
				// 分包处理,延时调用
				const maxChunk = 20;
				const delay = 20;
				for (let i = 0, j = 0, length = buffer.byteLength; i < length; i += maxChunk, j++) {
					let subPackage = buffer.slice(i, i + maxChunk <= length ? (i + maxChunk) : length);
					setTimeout(this._writeBLECharacteristicValue, j * delay, subPackage);
				}
			
				this.lanyardShow = false;
				this.$refs.uUpload.clear();
				this.clearFormData();
				uni.showToast({
					title: '打印成功',
					icon: 'success'
				})
			}, 5000)
									
			},
						
			/**
			 * 第十一步
			 * @param {最终的打印}
			 * @param {由第十步骤调用}
			 * @param {轮询打印}
			 * @param {打印机输出}
			 * @param {打印结束}
			 */	
			_writeBLECharacteristicValue(buffer) {
				wx.writeBLECharacteristicValue({
					deviceId: this._deviceId,
					serviceId: this._serviceId,
					characteristicId: this._characteristicId,
					value: buffer,
					success(res) {
						console.log('最后执行打印了===========', res)
					},
					fail(res) {
						console.log('打印失败', res)
					}
				})
			},
			/**
			 * 第十二步
			 * @param {蓝牙相关事件}
			 * @param {和以上打印不衔接}
			 * @param {关闭蓝牙}
			 */		
			closeBluetoothAdapter() {
				wx.closeBluetoothAdapter()
				this.discoveryStarted = false
			},
			/**
			 * 第十三步
			 * @param {判断蓝牙是否已经连接}
			 * @param {只支持wx. 不支持uni.}
			 * @param {只支持安卓, 不支持苹果}
			 */	
			isBluetoothDevicePaired(){
				  var that =this
					wx.isBluetoothDevicePaired({
					deviceId:uni.getStorageSync("BlueKey")?._deviceId,
				    success(res){
						console.log(res,"判断连接成功")
						that.connected_ly=true;
						that.ly_text="连接成功"
					},fail(err){
						console.log(err,"判断连接失败");
						that.ly_text="点击搜索"
					}
				})
				
			},	
			/**
			 * 第十四步
			 * @param {蓝牙相关资源事件}
			 * @param {搜索 资源 打印}
			 * @param {转换}
			 */	
			inArray(arr, key, val) {
				for (let i = 0; i < arr.length; i++) {
					if (arr[i][key] === val) {
						return i
					}
				}
				return -1
			},
			ab2hex(buffer) {	// ArrayBuffer转16进度字符串示例
				const hexArr = Array.prototype.map.call(
					new Uint8Array(buffer),
					function(bit) {
						return ('00' + bit.toString(16)).slice(-2)
					}
				)
				return hexArr.join(',')
			},	
			str2ab(str) {
				let buffer = new ArrayBuffer(str?.length)
				let dataView = new DataView(buffer)
				for (let i = 0; i < str?.length; i++) {
					dataView.setUint8(i, str?.charAt(i).charCodeAt(0))
				}
				return buffer;
			},
			/**
			 * 第十五步
			 * @param {进入页面就自动连接}
			 * @param {该方法存在BUG}
			 * @param {目前该方法先不投放使用}
			 */	
		    createBLEConnectionWithDeviceId(e) {
		      //创建蓝牙链接
		       uni.openBluetoothAdapter({
		       	success: (res) => {
		       		let ly_data={
		       			name:uni.getStorageSync("BlueKey")?._deviceId,
		       			deviceId:uni.getStorageSync("BlueKey")?._name
		       		}
		       		this._createBLEConnection(ly_data);
		       	},
		       	fail: (res) => {
		       		if (res.errCode === 10001) {
		       			uni.showModal({
		       				title: '错误',
		       				content: '未找到蓝牙设备, 请打开蓝牙后重试。',
		       				showCancel: false
		       			});
		       			this.connected_ly=false
		       		} else if (res.errCode === -1 || res.errCode === 10010) { //已连接
		       			this.connected_ly = true;
		       		}
		       	}
		       })
		    },
		    
			/**
			 * 第十六步
			 * @param {获取蓝牙适配状态}
			 * @param {在蓝牙连接成功后调用查看}
			 * @param {判断连接用}
			 */	
			getBluetoothAdapterState() {
				wx.getBluetoothAdapterState({
					success: (res) => {
						console.log(res)
						if(res.available){
							this.connected_ly=true
							this.ly_text="已连接"
							console.log("蓝牙已经连接",res)
						}else{
							this.connected_ly=false;
							this.ly_text="点击连接"
							console.log("蓝牙已经断开")
						}
					}
				})
			},
				
			

html

	<view class="ly-cass-box">
		  <view class="ly-cass"  @click="openBluetoothAdapter()">
		   <image src="../../static/bluetooth.png" style="width: 70rpx;height: 70rpx;" />
	 	  </view>
		 <text class="ly-text">{{ly_text}}</text>
		</view>
		
		<u-popup v-model="blue_list_ly" mode="center" border-radius="14" mask-close-able=false closeable=true
			width=85%>
			<view style="margin: 80rpx 20rpx 30rpx 20rpx;">
			<view class="has-devices-list-container">
				<view class="tip-search">搜索到的设备</view>
				<view class="devices-list">
					<view v-for="(item,index) in devices" :key="index" class="devices-item">
						<view>{{item.name ? item.name : item.localName}}</view>
						<u-button size="mini" type="warning" @click="_createBLEConnection(item)">
							连接
						</u-button>
					</view>
				</view>
			</view>
			</view>
		</u-popup>
	

css

	.ly-cass-box{
		width: 150rpx;
		height: auto;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		position: fixed;
		bottom:70rpx;
		right: 50rpx;
		z-index: 500;
	}
	.ly-cass{
		width: 120rpx;
		height: 120rpx;
		background-color: #f4f4f5;
		border-radius: 50%;
        display: flex;
		align-items: center;
		justify-content: center;
	}
	.ly-text{
	  margin-top: 20rpx;
	  background-color: #eee;
	  padding: 2rpx 8rpx 2rpx 8rpx;
	  border-radius: 6rpx;
	  font-size: 25rpx;
	}
	

 	.no-open-gps-tip {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		color: #fa3534;
		font-weight: 400;
		font-size: 30rpx;
		background: rgba(235, 207, 48, 0.8);
		padding: 30rpx;
	}
	.devices-item {
		width: 100%;
		display: flex;
		justify-content: space-between;
		margin-top: 20rpx;
		align-items: flex-end;
		padding-bottom: 5rpx;
		border-bottom: 1px solid #f4f4f5;
	}

	.devices-list {
		width: 100%;
		padding: 0 20rpx;
		display: flex;
		flex-direction: column;

	}

	.tip-search {
		width: 100%;
		margin: 20rpx 0;
		text-align: left;
		font-size: 16px;
		color: #2979ff;
	}

	.has-devices-list-container {
		width: 100%;
		display: flex;
		flex-direction: column;
		margin: 30rpx 0;
	}



打印执行的方法(这个方法已经封装好调用即可)

const PrinterJobs = require('./common/printer/printerjobs');//根据自己放的路径调用
const printerUtil = require('./common/printer/printerutil');//根据自己放的路径调用

目录结构

 核心代码代码下载

备注:核心代码在头顶上的zip当中

使用逻辑:

1.用户第一次进来点击连接,只用连接一次,只要用户不关闭程序就不会断开,可接着打印,

2.如果已经连接需要在主动加载函数里面调用判断是否已经连接

相关推荐

一步到位!用Vue轻松导出Word和Excel,同时附加多图,这个超详细教程让你成为文件处理能手!

vue 导出word文件和Excel文件,附带多张图片,封装好的js,直接调用就可以使用,简单便捷

qq_53722480的博客 4842

React 发送短信验证码和验证码校验功能组件

摘要: 该代码实现了一个带键盘跟随功能的验证码输入组件,主要特性包括: 响应式设计:通过useVisualViewport钩子检测键盘高度,自动调整输入框位置避免遮挡 验证码输入:支持6位数字输入,包含复制粘贴功能和样式化输入框显示 交互功能: 自动发送验证码 60秒重发倒计时 键盘弹出时自动聚焦输入框 UI组件:包含关闭按钮、手机号显示、验证码输入框和确认按钮 动画效果:淡入/上滑动画,输入框激活状态视觉效果 组件适用于移动端验证场景,提供良好的键盘交互体验。

qq_53722480的博客 311

Vue项目使用ssh2-sftp-client实现打包自动上传到服务器(完整教程)

🚀 Vue项目自动化部署方案 本教程教你使用ssh2-sftp-client实现Vue项目打包后自动上传服务器,告别手动拖拽! 核心功能: ✅ 打包后自动上传dist目录至服务器 ✅ 支持增量上传与文件权限保留 ✅ 可视化进度条与错误诊断 实现步骤: 安装依赖:ssh2-sftp-client + progress 配置package.json脚本,合并打包与部署 编写deploy.js核心代码,实现: SSH连接与认证 递归扫描本地文件 实时上传进度显示 错误分类处理(连接、认证、文件缺失等)

qq_53722480的博客 561

在React框架中使用Braft Editor集成Table表格的详细教程

BraftEditor是一款基于React的富文本编辑器,支持表格、多媒体和自定义样式功能。安装需使用npm或yarn添加braft-editor、braft-extensions和braft-utils三个核心包。配置包含默认控件设置(如字体、对齐、表格等)和表格扩展参数(行列数、边框样式)。使用示例展示了如何初始化编辑器、插入内容并获取HTML输出。该编辑器适用于CMS系统、报表工具等需要数据展示的场景,支持从WPS等办公软件复制内容。

qq_53722480的博客 614

vue+ts+TinyEditor 是基于 Quill 2.0 开发的富文本编辑器,提供丰富的扩展功能,适用于现代 Web 开发的完整安装使用教程

TinyEditor是基于Quill 2.0开发的富文本编辑器,提供丰富的扩展功能。安装步骤包括:1)安装核心依赖包;2)配置类型声明文件;3)更新tsconfig.json。核心代码示例展示了如何集成语法高亮、数学公式、截图等功能,并通过Vue组件实现编辑器与预览同步更新。编辑器支持多种工具栏配置选项,包括文本样式、列表、插入链接/图片/表情等,并提供@提及功能。该编辑器开箱即用,适合需要强大富文本编辑功能的项目集成。

qq_53722480的博客 621

「2025最新版React+Ant Design+Router+TailwindCss全栈攻略:从零到实战,打造高颜值企业级应用

高效开发秘籍:React+Ant Design+Router最新版整合教程,快速打造高颜值应用

qq_53722480的博客 1430

React安装使用教程

React+Ant Design+路由+axios+代码+环境配置+状态管理配置完整教程

qq_53722480的博客 998

深入解析:Vue3使用ECharts图表库实现饼图高亮(动图)的方法

【代码】深入解析:Vue3使用ECharts图表库实现饼图高亮(动图)的方法。

qq_53722480的博客 558

Vue 3: 通过图片链接获取图片颜色,间接设置背景颜色

在现代Web开发中,动态获取和处理图像数据是一个常见的需求。例如,你可能希望自动提取一张图片的主色调,以便根据这些颜色进行UI主题调整或其他视觉效果的处理。本文将介绍如何在Vue 3项目中,通过一个图片链接获取图片的颜色信息。适用场景:设置背景色(例如:根据音乐图片设置主题色)案例地址:(音乐模块的歌词)天梦星科技官网。

qq_53722480的博客 861

Vue3 与 Spline 的完美融合:打造动态背景的极致体验

Vue3 与 Spline 的完美融合:打造动态背景的极致体验

qq_53722480的博客 939

Vue 3 Vite 项目打包优化:自动删除指定文件的方法

在 Vue 3 项目中,如果你需要在打包之前删除指定的文件,可以使用 Node.js 的。3.如果需要获取到 package.json 里面的相关信息,例如获取version 版本号。文件中配置一个自定义的 Webpack 插件来完成。

qq_53722480的博客 1562

告别繁琐配置!Node.js安装与环境变量设置全攻略!

node 安装教程

qq_53722480的博客 1924

Java开发者必备!0元学习Maven环境最新版超详细配置教程

程序员必备宝典本教程旨在为 Java 开发者提供一份详尽且易于理解的 Maven 仓库配置指南,帮助你从零开始搭建高效的 Maven 开发环境。无论你是初学者还是有经验的开发者,通过本教程你都能掌握 Maven 仓库配置的核心技能,从而提升项目构建效率和依赖管理的能力。程序员必备宝典。

qq_53722480的博客 585

Spring Boot 3 文件管理:上传、下载、预览、查询与删除(全网最全面教程)

如何使用Spring Boot 3进行文件的上传、下载、预览、查询与删除操作,并提供一个完整的示例代码

qq_53722480的博客 1275

HTML+CSS 动态彩色背景

【代码】HTML+CSS 动态彩色背景。

qq_53722480的博客 460

前端开发必备:实用Tool封装工具类方法大全

程序员必备宝典网站。

qq_53722480的博客 464

Vue3+Vite配置代理隐藏真实请求地址,让你的前端开发更加安全高效!

配置代理隐藏真实请求地址

qq_53722480的博客 985

将CSS OKLCH颜色转换为十六进制HEX颜色和十六进制整数格式

我查找了全网都查不到OKLCH()方法是颜色转换方法,那今天小编就给大家分享我的方法,可能会有点点误差,但是大体不影响。好了,话不多说,直接上CssUtil代码!

qq_53722480的博客 1237

Vue前端浏览器指纹获取:数字世界的身份密码

多种数据源:从多个数据源收集信息,包括但不限于用户代理、屏幕分辨率、系统字体、WebGL、Web Audio、Canvas 等。跨浏览器兼容性:支持所有主流浏览器,包括 Chrome、Firefox、Safari、Edge 等。自定义:开发者可以根据自己的需求选择性地启用或禁用某些数据收集功能,以符合特定的隐私政策或法律要求。实时生成:在用户访问网站时实时生成指纹,无需额外的服务器处理。轻量级:库的体积相对较小,不会显著增加网页的加载时间。安全:生成的指纹通常是加密的,以减少数据泄露的风险。

qq_53722480的博客 1457

springboot 整合酷狗获取MV视频最高画质(使用自己账户)

在此声明,本内容仅供个人学习、研究或娱乐之用,严禁任何形式的商业用途。若您发现本内容被用于商业目的,请立即删除,及时与小编联系,我们将删除原代码。

qq_53722480的博客 558

SpringBoot 整合酷狗获取下载音乐(需要自己账户)

为了营造一个健康、积极的网络环境,我们鼓励用户遵守相关法律法规,尊重他人劳动成果,不进行任何形式的侵权行为。同时,我们也将持续优化内容审核机制,加强对侵权行为的打击力度,保障广大用户的合法权益。在此声明,本内容仅供个人学习、研究或娱乐之用,严禁任何形式的商业用途。若您发现本内容被用于商业目的,请立即与我们联系,我们将删除原代码。如有任何疑问或建议,欢迎随时联系小编。我们将竭诚为您提供帮助,共同维护一个和谐、有序的网络空间。(4)Dto 实体类KuGouHand。(3) 上请求示例代码。

qq_53722480的博客 695

SpringBoot项目运行时出现javax.net.ssl.SSLHandshakeException: PKIX路径构建失败:sun.security异常(本地/部署后)

javax.net.ssl.SSLHandshakeException: PKIX

qq_53722480的博客 3434

SpringBoot3与AOP完美结合:轻松追踪用户操作,实现精准日志记录

“SpringBoot3与AOP完美结合”方案提供了一个简洁、高效且灵活的方式来实现用户操作的日志记录,使得后端开发更加便捷,同时提升了最终软件产品的质量和可靠性。

qq_53722480的博客 995

SpringBoot实现手机号归属地查询功能,轻松获取手机号码信息

SpringBoot实现手机号归属地查询功能,轻松获取手机号码信息

qq_53722480的博客 654

快速学会SpringBoot图形验证码生成:一步步教你打造安全验证

5.SmsServiceImpl业务类。6.SmsController控制方法。天梦星服务平台 (tmxkj.top)4.SmsService接口类。3.config配置类。7.推荐程序员必备网站。

qq_53722480的博客 425

SpringBoot与GeoLite2的强强联手,为您解锁全球定位的超能力。真实IP追踪?地理位置归属?轻松实现,让您的服务遍布世界各地,无疆无界!

GeoLite2是一款强大的数据库,用于提供地理定位服务,它包含了两个主要的产品:GeoLite2 City和GeoLite2 Country,每个季度更新一次。覆盖全球城市层面的地理位置数据,精确到邮政编码级别。这为需要精细定位服务的应用提供了强大的支持。提供全球所有国家和地区的地理位置信息,虽然精度较GeoLite2 City略低,但足以满足大多数应用的需求。

qq_53722480的博客 1147

立即升级你的前端技能!跟随这份Vue3项目搭建教程,从零基础到专业,一步步掌握最新Web开发技术,打造响应快速、界面优雅的现代网站。

“Vue 3 + Vite + Axios + Cookie + Pinia + Element Plus + TailwindCSS + DaisyUI + Router 4:详细项目创建与安装指南”

qq_53722480的博客 784

“使用Vue.js实现原生HTML右键点击弹出菜单的详细代码示例“(详细代码)

原生html vuejs 点击右键弹窗菜单(详细代码)

qq_53722480的博客 418

uniapp/vue 实现PDF预览功能(PDFJS),组件调用和关闭

前端必备资源网站:天梦星服务平台 (tmxkj.top)

qq_53722480的博客 1404

SpringBoo+vue3+vite整合讯飞星火3.5通过webscoket实现聊天功能(前端代码)附带展示效果

访问地址:天梦星服务平台 (tmxkj.top)后端文档:SpringBoo+vue3整合讯飞星火3.5通过webscoket实现聊天功能(全网首发)附带展示效果_springboot websocket vue3-CSDN博客。

qq_53722480的博客 1295
上一篇: 一步到位!用Vue轻松导出Word和Excel,同时附加多图,这个超详细教程让你成为文件处理能手!
下一篇: vue2 与 vue3 watch 自动监听写法教程
开朗的网友(管理员)
开朗的网友(管理员) 天梦星科技官方账号 天梦星科技官方账号
博客等级 码龄6年 5010粉丝 66原创
评论 9
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值