在线示例
完整的 MiniDev SDK 模板项目（vue-default），使用 Vite 构建后嵌入浏览器实时运行。覆盖全部 20 个页面、80+ SDK API、30+ UI 组件。
交互提示
- 点击首页卡片进入对应模块的完整演示
- SDK API 调用会产生真实的视觉反馈（Toast、Loading、Dialog、ActionSheet 等）
- Storage 使用浏览器 localStorage，数据在页面刷新后仍然保留
- Network 请求通过 httpbin API 发出真实的 HTTP 请求
- 底部 TabBar 可在 Home / Device / User 三个页签间切换
模板覆盖模块
此在线演示基于 MiniDev Studio 内置的 Vue 默认模板项目，使用 Vue 3 + Vue Router + Vite 构建。包含以下完整 demo 页面：
| 模块 | 页面路径 | 覆盖 API |
|---|---|---|
| 🚀 首页 | pages/home/index | navigateTo、navigateToTab |
| 🧩 Components | pages/components-demo/index | 30+ m-* 组件 + 主题定制 |
| 🎨 UI | pages/ui-demo/index | showToast、showLoading、showDialog、alert、showActionSheet、setNavigationBarTitle/Color |
| 🌐 Network | pages/network-demo/index | request（GET/POST/PUT/DELETE）、interceptors |
| 💾 Storage | pages/storage-demo/index | setStorage、getStorage、removeStorage、clearStorage |
| 🧭 Router | pages/router-demo/index | navigateTo、navigateBack、reLaunch、navigateToTab、reLaunchTab、getCurrentPages、getRoute |
| ♻️ Lifecycle | pages/lifecycle-demo/index | onLoad、onReady、onShow、onHide、onUnload、onPullDownRefresh、onReachBottom |
| 📋 Clipboard | pages/clipboard-demo/index | setClipboard、getClipboard |
| 🗺️ Map | pages/map-demo/index | createMapContext（markers、polyline、polygon、circle、moveAlong） |
| 🚗 Vehicle | pages/vehicle-demo/index | getCurrentVehicleProfile、getCurrentVehicleStatus |
| 📊 Analytics | pages/analytics-demo/index | enableAutoAnalytics、recordEvent、enableNotification |
| ⚙️ App & Env | pages/app-demo/index | getLaunchOptionsSync、detectEnv、isSimulator、onAppShow/Hide、hello |
| 📱 Screen | pages/screen-demo/index | setScreenOrientation、getScreenBrightness、keepScreenOn |
| 🔒 Scroll Lock | pages/disable-scroll-demo/index | disableScroll 配置演示 |
| 📱 Device | pages/device-demo/index | getSystemInfo、getDeviceInfo、getAppInfo、getNetworkType、getLocation、vibrate、chooseImage、scanCode、uploadFile、TabBar 控制 |
| 👤 Auth | pages/auth-demo/index | getUserProfile、requestSSOLogin、requestLinkedLogin、authenticateWithBiometric、requestAuthorizationToken |
| 🎯 Select | pages/select-demo/index | navigateBack with data（onBack 模式） |
| 📩 Router Target | pages/router-target/index | onLoad（接收参数）、navigateBack with data |
| ♻️ Lifecycle Target | pages/lifecycle-target/index | 子页面生命周期事件 |
项目结构
src/
├── pages/
│ ├── home/ # 首页 — 14 个模块导航入口
│ ├── components-demo/ # UI 组件全览（Basic、Form、Layout、Display、Feedback、Media、Theme）
│ ├── ui-demo/ # Toast / Dialog / Alert / ActionSheet / NavBar / PreviewImage
│ ├── network-demo/ # HTTP 请求（GET/POST/PUT/DELETE）+ Interceptors
│ ├── storage-demo/ # 本地存储 CRUD + Batch Test
│ ├── router-demo/ # navigateTo / navigateBack / reLaunch / Tab Navigation / Page Info
│ ├── router-target/ # 路由目标页 — 参数接收 & onBack 数据返回
│ ├── lifecycle-demo/ # 页面生命周期 + Pull-down Refresh + Reach Bottom
│ ├── lifecycle-target/ # 子页面生命周期测试
│ ├── clipboard-demo/ # 剪贴板读写 + Quick Presets
│ ├── map-demo/ # 地图控件（Markers / Polyline / Polygon / Circle / MoveAlong）
│ ├── vehicle-demo/ # 车辆档案 & 实时状态
│ ├── analytics-demo/ # 事件追踪 + 通知管理
│ ├── app-demo/ # 启动参数 / 环境检测 / App 可见性 / Bridge Handshake
│ ├── screen-demo/ # 屏幕方向 / 亮度 / 常亮
│ ├── disable-scroll-demo/ # 禁止滚动（全屏页面）
│ ├── device-demo/ # 设备信息 / 网络 / 定位 / 振动 / 媒体 / 跨应用 / TabBar
│ ├── auth-demo/ # 用户档案 / SSO / 关联登录 / 生物识别 / 授权 Token
│ └── select-demo/ # 列表选择器（onBack 返回数据）
├── assets/styles/
│ ├── base.css # 全局基础样式
│ └── theme-variables.css # MD3 主题变量
└── App.vue # 根组件（router-view + keep-alive）