uni-app
中级通用
uni-app 是基于 Vue 开发语法的跨端应用框架，可将同一套项目构建为网页、小程序和手机 App。它帮助你复用页面与业务逻辑，减少多端重复开发，但登录、支付等平台差异仍需分别适配。
你可能会说：「我想做一个预约产品，网页、微信小程序和手机端尽量共用代码，怎么实现？」
动手看看把会员登录页发布到三端
1
先做一个会员登录页：页面和业务逻辑用 Vue 语法写在同一套项目里，这次先选择发布到网页。
要点uni-app 怎样让一套代码服务多个端？
- 1
用统一组件表达页面
你用 Vue 的方式组织页面和逻辑，用 view、text 等组件表达界面。因为这些组件面向多端，所以不能把依赖浏览器 DOM 的网页代码直接搬过来，期待它在小程序里照常运行。
- 2
为目标平台分别构建
同一个项目要按目标平台分别构建：网页产物交给网站服务器，小程序产物进入对应开发工具，App 则需要打包。这样复用的是源码，不是一份文件在所有平台直接运行。
- 3
把平台差异留出接口
统一 API 能减少重复代码，但各端提供的能力并不完全一致。比如预约产品的登录和支付，你可以复用订单逻辑，再用平台专属代码或条件编译处理差异，并在各端分别测试。
容易混淆的地方
Vue 主要提供界面组件与响应式逻辑的开发方式，uni-app 在此基础上增加跨端组件、API 和构建支持。响应式设计解决同一网页在不同屏幕上的布局问题；uni-app 则面对网页、小程序、App 等不同运行环境，屏幕适配仍需另外处理。
什么时候用
适合用
- 做门店预约产品，小程序负责获客，网页和 App 复用预约、订单等主要流程。
- 团队熟悉 Vue，要同时交付多个端的会员中心，希望共用表单和业务逻辑。
- 验证一个多端服务产品，核心功能以列表、详情和表单为主，愿意投入平台适配。
不适合用
- 只做依赖搜索引擎获客的内容网站，可选 Nuxt 或静态站点方案，无需引入跨端适配。
- 只做桌面浏览器里的复杂管理后台，用 Vue 配合网页组件库通常更直接。
- 只做深度调用系统能力的手机应用，且平台体验要求很高，可优先评估 Swift 或 Kotlin。
练一练选一个答案，看看解释
你用 uni-app 做预约产品，网页版本已经完成。现在要发布微信小程序，其中包含登录和支付。哪种安排最合理？
让 AI 帮你做复制给 AI Agent 直接用
请用 uni-app 和 Vue 3 开发门店预约产品，首期支持网页与微信小程序。复用门店列表、预约表单和订单逻辑，分别处理登录与支付。先列出平台差异及待确认事项，再实现页面，并提供两端的构建和测试步骤。