APP扫码识别区是正方形怎么修改成长方形，微信小程序是长方形的，扫码识别区太小了，很不方便

就当纪念一下抠了好几天的头。虽然实现了，也花了很多时间，但是没有什么成功了的实感，有种莫名其妙的感觉。
不论咋样，还是记录一下吧，百度之后竟然完全没有人用这个方式 在ios上登录，而ds和cursor一众ai费拉不堪，ds胡说八道的程度越来越严重了

oauth2的登录描述比较粗糙。

有一个最想知道的问题，想知道 ios中app和 webview 的 cookie传递。

过程：
1.根据文档设置 ios的schemes。注：urltypes 只能用string格式，不可用数组，否则打包 的link.info 中 没有 CFBundleURLTypes 的标签。
2.login接口后，后端会产生一个短暂的cookie会话，根据该会话证明过程中登录情况。若无法验证到该cookie会话，将直接跳回登录界面。
3.使用webview 打开 authorize 页面，如果验证成功，会通过schemes唤醒 app,接着验证获取token并跳转主页面。

其中遇到3个阻碍。

1. 在login接口后的 cookie会话，没有 设置 domain 时，webview 打开 authorize页面，一直都是cookie验证会话失败，直接跳转回登录界面。在设置 domain后，第一次 登录 cookie会话验证失败，而第二次继续登录的验证都通过了。
   询问了ds等ai，给出的解释是 在ios时，网络请求和Cookie存储与App本身不在同一进程，默认不共享NSHTTPCookieStorage。所以通过webview 后端会拿不到cookie从而导致失败。而安卓的cookie在uni-app底层已经同步过，所以不存在该问题。但问题是为什么设置了domain后，除了第一次失败，后续的登录都成功了？是不是底层也对ios同步过？但为什么第一次不成功？强制手动给webview注入cookie，没有一个方式成功。设置延时任务也没有用，设置多长也没有用，第一次就是不能通过。
   后续与后端沟通，通过 生成token附带在 authorize的path后，后端使用token来验证会话解决该问题。

2.page.json中 设置过 // "condition": {
// //模式配置，仅开发期间生效
// "current": 0, //当前激活的模式(list 的索引项)
// "list": [{
// "name": "", //模式名称
// "path": "", //启动页面，必选
// "query": "" //启动参数，在页面的onLoad函数里面得到
// }]
// }。

从而导致 schemes唤醒后，无法获取schemes携带的数据。安卓无此问题。

3.后端schemes因为ios的安全机制是无法自动唤醒app，除非用户手动点。Universal Links 也没办法在同域名下进行唤醒。但是，实际上 传递数据已经触发，在plus.runtiem.arguments中是有数据的。所以直接搞了一个 定时任务监听这个数据，一旦有数据就可以直接后续的步骤，不需要用户手动点击。安卓可以直接通过schemes唤醒app并直接拿到数据，所以也不需要这个定时任务

用的uniapp 原生的底部导航栏，有四个导航，我想在某个导航的右上角加几个字，有办法实现嘛

关于安卓搜索蓝牙设备报错startBluetoothDevicesDiscovery:fail Location services are turned off 10016，我也遇到同样的问题，搜了很多相关问题。最后发现，开启位置权限只是其中一步，安卓手机在设置--隐私里面还有一个位置服务需要开启，我找到一段代码可以判断是否开启位置服务，希望能够给到大家帮助！

let systemType = uni.getSystemInfoSync().platform;  
                // 安卓  
                if (systemType === 'android') {  
                    var context = plus.android.importClass('android.content.Context');  
                    var locationManager = plus.android.importClass('android.location.LocationManager');  
                    var main = plus.android.runtimeMainActivity();  
                    var mainSvr = main.getSystemService(context.LOCATION_SERVICE);  
                    if (!mainSvr.isProviderEnabled(locationManager.GPS_PROVIDER)) {  
                        uni.showModal({  
                            title: '提示',  
                            content: '搜索蓝牙设备需要开启定位服务功能',  
                            showCancel: false,  
                            confirmText: '去开启',  
                            success() {  
                                if (!mainSvr.isProviderEnabled(locationManager.GPS_PROVIDER)) {  
                                    var Intent = plus.android.importClass('android.content.Intent');  
                                    var Settings = plus.android.importClass('android.provider.Settings');  
                                    var intent = new Intent(Settings.ACTION_LOCATION_SOURCE_SETTINGS);  
                                    main.startActivity(intent); // 打开系统设置定位服务功能页面  
                                } else {  
                                    console.log('定位服务功能已开启');  
                                }  
                            }  
                        });  
                    }   
                }

星光不负，码向未来。本文记录了一个习惯养成类应用从零开始，基于 uni-app 开发并成功上架华为应用市场的完整历程，希望能为正在探索鸿蒙开发的开发者提供一些参考。

一、缘起：为什么选择 uni-app + 鸿蒙

鸿蒙生态快速发展，HarmonyOS NEXT 的发布让原生应用开发成为趋势。作为一个独立开发者，我面临一个选择：是学习全新的 ArkTS 开发，还是利用现有的技术栈快速进入鸿蒙生态？

最终，我选择了 uni-app。原因很简单：

开发效率：我已经熟悉 Vue3 和前端开发，uni-app 让我可以复用现有技能，快速上手
跨平台能力：一套代码可以同时覆盖 iOS、Android 和鸿蒙，降低维护成本
生态成熟：uni-app 对鸿蒙的支持已经相对完善，官方文档和社区资源丰富
快速迭代：对于个人开发者来说，时间就是成本，uni-app 能让我更快地验证产品想法

于是，我决定用 uni-app 开发一款名为"习惯修仙"的习惯养成应用，并将其作为进入鸿蒙生态的敲门砖。

二、项目概述：习惯修仙

"习惯修仙"是一款将游戏化机制与习惯养成结合的应用。用户可以将早起、运动、阅读等日常行为映射为"功法"，通过完成习惯获得"修为"，提升"境界"，让枯燥的习惯养成变得有趣。

核心功能

功法管理：支持计时、计数、打卡三种类型的习惯任务
修为系统：完成任务获得修为，积累到一定程度可以"破境"
数据统计：记录每日、每周、每月的完成情况
华为账号登录：支持华为账号一键登录，数据云端同步

技术栈

框架：uni-app（Vue3）
状态管理：Pinia
样式：SCSS + 自定义主题系统
工具库：dayjs（时间处理）、echarts（数据可视化）
目标平台：HarmonyOS

三、开发实践：从零到一

3.1 项目初始化

使用 HBuilderX 创建 uni-app 项目后，第一件事就是配置鸿蒙相关设置。在 manifest.json 中，需要配置：

包名（bundleName）：这是应用的唯一标识，需要与华为开发者后台保持一致
图标和启动页：准备符合鸿蒙规范的图标和启动画面
签名配置：配置 Release 证书，用于正式打包

这里有一个小坑：包名一旦确定，后续修改会比较麻烦，建议在项目初期就规划好。

3.2 状态管理架构

习惯养成类应用的核心是数据管理。我使用 Pinia 构建了全局状态管理，主要包括：

用户数据：修为、境界、属性等游戏化数据
任务数据：功法列表、打卡记录、统计数据
应用配置：主题、设置、登录状态等

Pinia 的持久化插件让我可以轻松实现本地数据存储，这对于离线使用场景很重要。同时，我也预留了云端同步的接口，为后续的账号登录功能做准备。

3.3 页面开发与路由

uni-app 的页面路由系统与小程序类似，通过 pages.json 配置页面路径和导航栏样式。我设计了以下主要页面：

启动页：应用介绍和引导
首页：今日任务概览和快速操作
功法列表：展示所有习惯任务
功法详情：查看任务详情和历史记录
计时页面：专注计时功能
个人中心：用户信息和设置

在开发过程中，我发现 uni-app 的条件编译功能非常实用，因为开发的时候是在浏览器上调试，最后再在鸿蒙真机运行测试。通过 #ifdef APP-HARMONY 可以针对鸿蒙平台做特殊处理，比如使用鸿蒙原生的某些能力。

3.4 样式与主题系统

为了保持多端一致性，我建立了一套自定义主题系统。通过 SCSS 变量定义颜色、字体、间距等，然后在各个页面中统一使用。这样不仅保证了视觉一致性，也方便后续的主题切换功能。

四、华为能力集成：登录功能实战

4.1 为什么选择华为账号登录

最初我计划同时支持微信登录和华为账号登录，但考虑到开发成本和维护复杂度，最终只保留了华为账号登录。实际上，在审核过程中发现，华为应用市场并不会硬性要求必须有华为账号登录，只要应用功能完整、符合规范即可通过审核。

4.2 集成过程

华为账号登录的集成主要分为几个步骤：

开发者后台配置
在华为开发者联盟注册账号并创建应用
获取 Client ID
配置公钥指纹（与签名证书绑定）
申请 OAuth 权限（openid、profile 等）

manifest.json 配置
在 app-harmony.distribute.modules 中添加 uni-oauth 模块
配置华为的 client_id

代码实现
使用 uni.login({ provider: 'huawei' }) 获取授权码
通过 uni.getUserInfo({ provider: 'huawei' }) 获取用户信息
将授权码发送到后端验证，获取用户 token
更新本地登录状态

4.3 登录流程优化

为了提升用户体验，我做了以下优化：

登录状态持久化：用户登录后，下次打开应用自动保持登录状态

数据同步机制：登录后自动同步本地数据到云端，避免数据丢失

优雅降级：如果登录失败，应用仍可以以游客模式使用核心功能

五、上架准备：审核与发布

5.1 华为应用市场审核要点

华为应用市场的审核相对严格，我总结了几个关键点：

隐私政策与用户协议

必须提供完整的《用户协议》和《隐私政策》文档。我在登录页面底部添加了相关链接，并在首次启动时引导用户阅读。

权限申请规范

应用申请的权限必须在功能说明中明确用途，且不能强制申请。我的应用只在需要时才动态申请权限，并在申请时说明用途。

应用描述与截图

应用描述要清晰、真实，不能夸大功能。截图要展示应用的核心功能，不能使用误导性的图片。

5.2 审核经历

我的应用审核了两次才通过。第一次提交审核时，审核驳回原因是"功能交互简单，影响用户的总体体验"。确实，第一版本是有点简单。修复后重新提交，大约 3 个工作日就通过了审核。

5.3 上架后的数据与反馈

应用上架后，我持续关注用户反馈和数据表现：

下载量：初期增长较慢，但随着应用市场推荐和用户口碑传播，逐渐提升
用户反馈：通过应用内反馈功能收集用户意见，持续优化

六、经验总结与建议

6.1 开发过程中的关键决策

选择 uni-app 而非原生开发

这个决策让我节省了大量学习成本，能够快速将产品推向市场。虽然在某些性能敏感的场景下，原生开发可能更有优势，但对于大多数应用来说，uni-app 的性能已经足够。

使用 Pinia 而非 Vuex

Pinia 是 Vue3 官方推荐的状态管理方案，API 更简洁，TypeScript 支持更好。对于新项目，建议直接使用 Pinia。

本地数据优先，云端同步补充

考虑到网络环境和用户体验，我采用了本地数据优先的策略。用户即使不登录，也能正常使用所有功能。登录后，数据会自动同步到云端，实现多设备数据共享。

6.2 常见问题与解决方案

问题一：鸿蒙平台样式差异

不同平台的样式渲染可能有细微差异，解决方案是使用条件编译。也发现了 tabBar 配置 borderStyle 不生效的问题，已经反馈了 Bug：https://ask.dcloud.net.cn/question/215475

问题二：echarts 在鸿蒙平台不显示

应用使用了 echarts 进行数据可视化，在 web 端运行正常，但在鸿蒙平台上，图表完全不显示。排查后发现，echarts 在鸿蒙平台需要通过特殊方式引入。解决方案是 renderjs, 在页面中通过 script 标签引入 echarts 的 JS 文件。

6.3 给其他开发者的建议

提前规划，避免返工

在项目初期，就要规划好包名、证书、权限等关键配置。这些配置一旦确定，后续修改成本较高。

重视测试，特别是真机测试

模拟器测试只能发现部分问题，真机测试才能发现真实的性能和兼容性问题。建议在开发过程中定期进行真机测试。

关注审核规范，提前准备

华为应用市场的审核规范相对严格，建议在开发过程中就按照规范要求实现，避免上架时被退回。

持续优化，关注用户反馈

上架只是开始，不是结束。要持续关注用户反馈，优化产品功能和用户体验。

七、结语

从零开始到成功上架，这个过程充满了挑战，但也收获满满。uni-app 让我能够用熟悉的技术栈快速进入鸿蒙生态，而鸿蒙生态的快速发展也为开发者提供了新的机遇。

对于想要进入鸿蒙生态的开发者，我的建议是：不要犹豫，现在就是最好的时机。uni-app 已经为鸿蒙开发铺好了路，你只需要迈出第一步。

习惯修仙应用已在华为应用市场上架，欢迎体验和反馈。未来，我会继续优化"习惯修仙"应用，探索更多鸿蒙原生能力，比如推送通知、健康数据接入等。同时，我也会关注 HarmonyOS NEXT 的发展，为应用的长期发展做好准备。

希望这篇文章能为正在探索鸿蒙开发的开发者提供一些帮助，也期待在鸿蒙生态中看到更多优秀的应用。

作为一个学生开发者，我深知考研复习过程中“知识点零散难整合、复习计划难落地、错题整理效率低”的痛点——身边同学常因打开复习工具卡顿、多设备错题不同步、分享考点需反复跳转而影响复习节奏。结合课程设计任务，我开发了“学记宝”考研复习小工具，集错题本、复习计划提醒于一体，轻量且适配鸿蒙全场景。开发中，为解决工具启动慢、数据同步难、考点分享繁琐等问题，我集成了鸿蒙云开发、云测试、云调试三项开放能力，大幅提升使用体验，以下分享具体集成与落地过程。
一、鸿蒙开放能力体现及集成背景
本次开发核心集成了鸿蒙开放平台的云开发、云测试、云调试三项能力，分别从数据支撑、质量保障、问题排查三个维度解决学生开发过程中的核心难题，各项能力的核心功能及集成背景如下：

1. 云开发能力：核心功能提供一站式后端云服务，包含云数据库、云存储、云函数等模块，无需开发者搭建独立服务器，即可实现数据的安全存储、多设备实时同步与高效调用。集成背景：作为学生开发者，我既缺乏搭建运维服务器的资金，也没有足够的后端开发经验，而“学记宝”需要支持多用户错题集、复习计划的实时同步，云开发的无服务器架构恰好解决这一痛点，让我能专注于前端功能设计，同时保障数据安全稳定。
2. 云测试能力：核心功能提供大规模真机设备池与自动化测试工具，支持多版本鸿蒙系统、多品牌机型的兼容性测试，可自动执行功能测试、性能测试并生成详细报告。集成背景：考研工具用户覆盖不同品牌手机，我仅拥有1台测试手机，无法验证多设备适配效果，手动测试效率极低且易遗漏问题，云测试能让我零成本实现全场景兼容性验证，保障工具在各类设备上稳定运行。
3. 云调试能力：核心功能支持远程连接云端真机，实时操控设备进行调试，可同步查看应用运行日志、断点调试代码，无需本地搭建复杂调试环境。集成背景：开发中常遇到“本地运行正常、他人使用报错”的问题，且部分同学反馈的平板端适配问题无法在我的手机上复现，云调试能让我直接远程调试目标设备，快速定位并解决跨设备问题。
   二、核心能力集成的关键步骤
   三项能力均基于鸿蒙DevEco Studio与开发者平台协同实现，重点聚焦学生开发中“低成本、高效率”的核心需求，具体集成步骤如下：
4. 云开发能力集成步骤
   核心是通过SDK快速实现数据云端化，解决多设备同步与后端开发难题，关键节点包括：
   • 步骤一：在鸿蒙开发者平台开通云开发服务，创建“学记宝”专属服务空间，获取空间ID、API密钥等配置信息，享受学生开发者免费资源额度。
   • 步骤二：在DevEco Studio中导入云开发SDK，在应用启动类初始化云服务，关联服务空间，代码示例如下：

   public class MyApplication extends AbilityPackage {  
       @Override  
       public void onInitialize() {  
           super.onInitialize();  
           // 云开发初始化，关联学记宝服务空间  
           CloudDB.init(this, new CloudDBConfig.Builder()  
                   .setSpaceId("xuejibao-2025")  
                   .setApiKey("OHOS-CLOUD-KEY-XXX")  
                   .build());  
       }  
   }

   • 步骤三：设计云数据库结构，创建“examPoint”（高频考点）、“errorQuestion”（错题集）、“reviewPlan”（复习计划）三个核心集合，设置字段权限（如用户仅可读写自身数据），通过云函数实现“复习计划到期推送”自动化逻辑。
   1.1.1 2. 云测试能力集成步骤
   核心是利用云端设备池实现多场景兼容性测试，无需购置实体设备，关键节点包括：
   • 步骤一：在DevEco Studio中关联鸿蒙云测试平台，将“学记宝”编译生成的HAP包上传至测试平台，选择适配考研群体常用的设备型号（如华为Mate 60、荣耀Magic6、平板MatePad Pro等），覆盖HarmonyOS 4.0及以上版本。
   • 步骤二：设计自动化测试用例，聚焦核心功能——如考点搜索响应速度、错题添加与同步、复习计划提醒触发，利用平台可视化工具设置测试步骤，例如“打开工具→搜索‘考研数学极限公式’→验证结果加载时间≤500ms”。
   • 步骤三：执行批量测试与性能监控，开启“稳定性测试”模式（持续运行2小时），重点监测CPU占用率、内存泄漏情况，测试完成后获取包含设备适配报告、性能瓶颈分析的详细文档，针对“平板端考点排版错乱”“低版本系统提醒延迟”等问题进行优化。

5. 云调试能力集成步骤
   核心是通过远程调试解决跨设备问题，实时定位用户反馈的异常，关键节点包括：
   • 步骤一：在云调试平台选择用户反馈异常的设备型号（如某同学反映的荣耀Play8 Pro），发起远程调试请求，获取设备控制权，建立DevEco Studio与云端设备的实时连接。
   • 步骤二：开启日志实时输出与断点调试，让用户复现异常操作（如“添加错题后切换设备未同步”），通过调试工具定位到云数据库同步逻辑的漏洞——未设置“数据变更监听”，实时修改代码并在云端设备验证修复效果。
   • 步骤三：记录问题修复过程与验证结果，便于后续同类问题排查。
   1.2 三、场景落地与实际效果
   三项能力深度落地于“学记宝”的开发全流程与用户使用场景，解决了学生开发的资源限制与工具的核心痛点，量化效果如下：
6. 云开发能力：开发成本降90%，数据同步零障碍
   集成前，测算自主搭建服务器每月成本约800元；集成后，依托学生免费资源，月均成本仅80元（超出免费额度部分），数据同步延迟≤1秒，多设备使用用户占比从初期15%提升至72%，错题同步成功率100%。
7. 云测试能力：设备覆盖提升10倍，问题发现率达95%
   落地场景：保障工具在不同设备、系统版本上的兼容性。集成前，仅能测试2台个人设备，上线后收到“平板端排版错乱”“旧手机启动闪退”等反馈，问题修复周期平均3天；集成后，可测试20 台云端设备，提前发现8类兼容性问题，上线后初期故障反馈率从28%降至4%，问题修复周期缩短至4小时。
8. 云调试能力：问题定位效率提升80%，用户满意度提高
   集成前，同学反馈“错题添加后不显示”，因无法复现问题，排查耗时平均2小时；集成后，通过云调试远程操控同学同款设备，10分钟内定位到“云数据库写入权限配置错误”，实时修复并验证，用户问题解决满意度从65%提升至98%。
   四、总结
   云开发、云测试、云调试三项能力构建了“开发-测试-调试”全流程支撑体系，完美解决了学生开发者“缺资金、缺设备、缺经验”的困境。云开发实现数据低成本同步，云测试保障多设备兼容性，云调试快速响应问题。
   作为学生开发者，鸿蒙开放能力让我深刻感受到技术普惠的力量——无需专业团队支撑，仅凭个人就能开发出高质量工具。

从鸿蒙适配到迎娶白富美：一个程序员的逆袭之路

2025年春天，公司正处在发展的十字路口。我们是一家深耕工业物联网多年的科技企业，手握多项核心专利，却始终卡在“最后一公里”——客户落地难、交付周期长、跨平台兼容性差。就在这个节骨眼上，一通电话打破了平静。

“华为生态链头部客户要下大单！但前提是——必须在两周内完成APP对鸿蒙Next系统的完整适配，并支持元服务功能。”
——董事长在紧急会议上宣布，语气中带着前所未有的凝重。

会议室鸦雀无声。技术总监老张脸色发白：“鸿蒙Next已经彻底抛弃安卓兼容层，这意味着我们现有的Android原生App几乎要推倒重来……两周？不可能！”

我坐在角落，默默听着大家的焦虑。作为公司里唯一长期使用 uni-app 开发多端应用的工程师，我心里却燃起一丝希望。

危机中的转机：uni-app 成为破局关键

那天晚上，我翻出自己过去三年用 uni-app 维护的十几个项目——覆盖微信小程序、iOS、Android，甚至 H5。突然想起不久前看到的一条消息：uni-app v3.99+ 已全面支持鸿蒙 Next 与元服务。

“如果能复用现有代码，或许真有机会！”我立刻打开 DCloud 官网文档，确认了三点关键信息：

1. 语法兼容：依然使用 Vue 3 + TypeScript，无需学习 ArkTS；
2. API 桥接：uni.login()、uni.share() 等接口已自动适配鸿蒙环境；
3. 元服务支持：只需在 pages.json 中标记页面为原子化服务即可。

第二天一早，我直接敲开了董事长办公室的门。

“王董，给我三天时间。如果搞不定，我主动辞职。”

他盯着我看了十秒，最终点头：“好，资源你随便调，失败不追责，成功——你就是技术负责人。”

72 小时极限攻坚：从零到鸿蒙上架

第一天：环境搭建 + 证书配置（4 小时）

我迅速安装 HUAWEI DevEco Studio，导入公司主力产品“智联工控”的 uni-app 工程。得益于 uni-app 的标准化结构，项目几乎无痛迁移。

# 使用HBX命令行工具初始化鸿蒙项目  
hbx create --type app --name SmartFactory --template uni-preset-vue

接着在华为AGC平台申请四大证书（p12、csr、cer、p7b）。过程比想象中简单，尤其对比苹果那套繁琐流程，华为的自动化程度令人惊喜。

第二天：核心代码改造（8小时）

重点改造四个模块：

1. 登录体系切换为华为账号

原代码依赖自建账号系统，现需接入华为OAuth：

// 改造前（自建登录）  
uni.request({  
  url: 'https://api.company.com/login',  
  data: { username, password }  
});  

// 改造后（鸿蒙静默登录）  
uni.login({  
  success: (res) => {  
    // 获取 authCode  
    const code = res.code;  
    // 后台用 code 换取 OpenID 和手机号  
    uni.request({  
      url: 'https://api.company.com/harmony/login',  
      method: 'POST',  
      data: { auth_code: code }  
    });  
  }  
});

后端同事配合极快，当晚就完成了华为OAuth2.0对接。

2. 权限申请适配

鸿蒙对权限管理更严格，需动态申请：

// 请求位置权限  
uni.authorize({  
  scope: 'scope.location',  
  success() {  
    uni.getLocation({ type: 'gcj02' });  
  }  
});

3. 分享功能切换 provider

// 原微信分享  
uni.share({  
  provider: 'weixin',  
  scene: 'WXSceneSession'  
});  

// 鸿蒙分享（自动识别环境）  
uni.share({  
  provider: 'harmony', // uni-app 自动路由到鸿蒙API  
  title: '设备运行状态报告',  
  summary: '点击查看实时数据'  
});

4. 元服务卡片开发

最关键的突破！我们在 pages.json 中新增原子化页面：

{  
  "pages": [  
    {  
      "path": "pages/dashboard/mini",  
      "style": {  
        "isEntry": true,  
        "isAtomic": true,  
        "navigationBarTitleText": "设备监控"  
      }  
    }  
  ]  
}

用户无需安装完整APP，即可通过服务卡片查看设备温度、能耗等核心指标——这正是客户最看重的功能！

第三天：真机调试 + 上架审核（6小时）

用华为nova 12真机测试，启动速度比Android版快40%。提交至华为应用市场后，仅5小时就通过审核！

当我在群里发出“已上架”截图时，整个技术部沸腾了。

董事长的赏识与命运的转折

庆功宴上，董事长举杯对我说：“小陈，从今天起，你就是CTO助理，直接向我汇报。”

更让我意外的是，他女儿林婉清——公司新任业务总监，竟主动加我微信：“下次客户演示，你跟我一起去。”

林婉清，海归MBA，肤白貌美，气质干练。过去我只敢远远看一眼，如今却要并肩作战。

接下来三个月，我们接连拿下三个鸿蒙生态订单：

1. 智慧园区项目：用uni-app快速输出鸿蒙+元服务双版本，客户现场扫码即用；
2. 医疗巡检系统：利用uni-app的跨端能力，一套代码同时交付iOS、Android、HarmonyOS；
3. 零售POS终端：通过鸿蒙分布式能力，实现手机与POS机无缝协同。

每次演示，她负责讲解业务价值，我负责现场编码调试。有一次客户临时要求增加NFC打卡功能，我当场用uni-app插件市场集成鸿蒙NFC模块：

// 调用鸿蒙NFC读取标签  
const nfc = uni.requireNativePlugin('HarmonyNFC');  
nfc.readTag((data) => {  
  console.log('NFC标签内容:', data);  
});

客户当场签约。林婉清看着我，眼里闪着光：“你真是我的幸运星。”

技术成就爱情：uni-app成红娘

渐渐地，我们的合作从工作延伸到生活。她喜欢喝星巴克，我就用uni-app写了个“咖啡优惠券聚合”小程序送她；她出差怕丢行李，我给她做了个带蓝牙追踪的鸿蒙元服务卡片。

去年圣诞节，我在公司年会上公开表白，背景屏播放着我们共同开发的六个鸿蒙应用图标，最后定格在一行代码：

<template>  
  <view class="love">  
    {{ herName }} + {{ myName }} = Forever  
  </view>  
</template>  

<script setup>  
const herName = 'Lin Wanqing';  
const myName = 'Chen Tech';  
</script>

全场欢呼。董事长笑着点头：“我早就看出来了——技术过硬，人品可靠，配得上我女儿。”

今年五一，我们领证了。婚礼上，我送给她的不是钻戒，而是一个定制的uni-app项目——《我们的爱情编年史》，支持鸿蒙、iOS、Android三端同步，连元服务卡片都做了纪念日提醒。

结语：时代红利属于准备好的人

回望这段经历，我深知：不是我有多厉害，而是选对了工具，踩准了风口。

uni-app让我在技术变革浪潮中脱颖而出；鸿蒙Next的生态红利，给了普通人逆袭的机会。如果你也在焦虑“是否要学ArkTS”“旧项目怎么办”，我的答案是：

别重写，用uni-app改造！三天，足够改变命运。

如今，作为公司技术负责人，我带队全面转向uni-app + 鸿蒙架构。而林婉清常说：“当初那个敢赌三天的男人，现在是我最坚实的依靠。”

技术改变世界，也改变了我的人生。

关于uni-push，即日起vivo推送基于《 消息分类说明》对本地通知进行分类管控，若应用在2026年1月1日前未完成渠道备案申请以及未设置channel_id，发送的本地通知将默认为运营消息。详情请查阅《 vivo本地通知分类管控公告》。

为了不影响您应用的重要消息推送，建议您：

1. 在vivo开发者平台完成渠道备案申请，接入流程详见《 本地通知接入说明》。

2. 若您发送个推在线消息是纯透传类型，并且应用端在接收消息后，调用本地通知接口展示消息到通知栏，则需要对应设置所申请的通知渠道id和渠道名称，个推服务端API无需改动；若您发送个推在线消息是通知类型，则调用个推服务端API时，设置channel_id和channel_name参数，对应填入所申请的通知渠道id和渠道名称，接口详见《公共请求参数-push_message 在线个推通道消息内容 接口》。

（注：

1. 本地通知指应用在运行时，直接调用系统接口，不通过厂商vpush系统通道发送的通知。

2. 透传，即只发送数据给应用端，个推并不做任何处理，应用端可以自己解析字符串进行业务逻辑的实现，比如语音播报、或者创建自定义通知等；通知，即为经个推sdk自动处理后，在通知栏以通知形式展示。）

以上请尽快完成适配，根据应用业务场景，发送不同类别的消息。

如有疑问，可以添加微信客服群进行咨询，加群方式参考文档：https://uniapp.dcloud.net.cn/unipush-v2.html#%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98

在el-form标签上添加@submit.native.prevent
例如：

<el-form @submit.native.prevent></el-form>

uniapp-vue3-hotel：一款全新自研的uni-app+vue3 setup+pinia2+uv-ui搭建跨端仿携程/同程旅游app酒店预约系统模板。提供了首页、酒店预订搜索、列表/详情、订单、聊天客服消息、我的等页面模块。支持编译到H5+小程序+APP端。

使用技术

• 开发工具：HbuilderX 4.84
• 技术框架：uni-app+vite5+vue3
• 状态管理：pinia2
• UI组件库：uni-ui+uv-ui（uniapp+vue3组件库）
• 弹框组件：uv3-popup（基于uniapp+vue3多端弹窗组件）
• 自定义组件：uv3-navbar导航条+uv3-tabbar菜单栏
• 缓存技术：pinia-plugin-unistorage
• 编译支持：web+小程序+app端

项目框架结构

使用uniapp+vite5搭建项目，vue3 setup语法开发。

目前uni-vue3-hotel酒店预订项目已经发布到我的原创作品小铺。

uniapp+vue3+pinia2+uvui跨多端酒店预订app系统

想要了解更多项目的详细介绍，可以去看看下面这篇文章。

最新版uni-app+vue3+uv-ui跨端仿携程酒店预订模板【H5+小程序+App端】

热文推荐

最新版uni-app+vue3+uv-ui跨三端仿微信app聊天应用【h5+小程序+app端】
最新版uniapp+vue3+uv-ui跨三端短视频+直播+聊天【H5+小程序+App端】
uniapp-vue3-os手机oa系统|uni-app+vue3跨三端os后台管理模板
原创uniapp+vue3+deepseek+uv-ui跨端实战仿deepseek/豆包流式ai聊天对话助手。
Tauri2.8+Vue3聊天系统|vite7+tauri2+element-plus客户端仿微信聊天程序
Tauri2-Vite7Admin客户端管理后台|tauri2.9+vue3+element-plus后台系统
Electron38-Vue3OS客户端OS系统|vite7+electron38+arco桌面os后台管理
electron38-admin桌面端后台|Electron38+Vue3+ElementPlus管理系统
Electron38-Wechat电脑端聊天|vite7+electron38仿微信桌面端聊天系统
vue3-webseek网页版AI问答|Vite6+DeepSeek+Arco流式ai聊天打字效果
Flutter3-MacOS桌面OS系统|flutter3.32+window_manager客户端OS模板
最新研发flutter3.27+bitsdojo_window+getx客户端仿微信聊天Exe应用
最新版Flutter3.32+Dart3.8跨平台仿微信app聊天界面|朋友圈
Electron35-DeepSeek桌面端AI系统|vue3.5+electron+arco客户端ai模板

之前使用vue 写过后台管理系统的腾讯云直传，使用的是cos-js-sdk-v5库，使用了三方库后就非常的简单代码也不多。
这次要在uniapp项目上写腾讯云直传，于是又把以前的代码拿来用了起来，在浏览器上调试好后，真机运行到手机上发现出问题了！
在uniapp中使用"cos-js-sdk-v5"库时，提示
warning: cos-js-sdk-v5 不支持 nodejs 环境使用，请改用 cos-nodejs-sdk-v5
按照提示安装 "cos-nodejs-sdk-v5"，运行APP后直接报错APP无法正常启动，如下图所示：

卡住了不知道该怎么办？

然后就找到了腾讯云文档中心的这篇文章 uni-app 直传实践
思路是：使用uni.chooseImage选择图片文件，然后把文件类型传递给后端，后端返回腾讯云的相关信息，前端使用uni.uploadFile上传文件

原作者的文章：https://ask.dcloud.net.cn/article/39345
原作者的github地址：vue-inset-loader
vue2+webpack版本：ste-vue-inset-loader
vue3+vite版本：vue3-inset-loader