使用ionic2开发一个二维码扫描功能
界面添加一个按钮:
<button ion-button block color="secondary" class="Scan-button" (click)="scanQR()" [disabled]="loading">点我扫描</button>
ts具体代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | import { Component } from '@angular/core' ; import { NavController } from 'ionic-angular' ; import { BarcodeScanner } from "ionic-native" ; @Component({ selector: 'page-home' , templateUrl: 'home.html' }) export class HomePage { public scannedText: string; constructor(public navCtrl: NavController) { } public scanQR() { BarcodeScanner.scan().then((barcodeData) => { if (barcodeData.cancelled) { console.log( "User cancelled the action!" ); return false ; } console.log( "Scanned successfully!" ); console.log(barcodeData); this .scannedText=JSON.stringify(barcodeData); }, (err) => { console.log(err); }); } } |
运行时会告诉你缺这个缺那个,只管npm install即可
然后编译成apk的时候会提示没有接受条款,其实是找不到依赖包,根据提示使用SDK Manager装上就行,扫描效果还是很好的。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· 周边上新:园子的第一款马克杯温暖上架
· 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
· Ollama——大语言模型本地部署的极速利器
· DeepSeek如何颠覆传统软件测试?测试工程师会被淘汰吗?
· 使用C#创建一个MCP客户端