Back to Details

uni-app

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese
The skill is based on uni-app documentation, generated at 2026-01-30.
uni-app is a Vue.js-based cross-platform framework for developing applications that run on iOS, Android, HarmonyOS, Web (responsive), and various mini-program platforms (WeChat/Alipay/Baidu/Douyin/Feishu/QQ/Kuaishou/DingTalk/Taobao/Jingdong/Xiaohongshu).
本技能基于uni-app文档生成，生成时间为2026年1月30日。
uni-app是一个基于Vue.js的跨平台开发框架，可用于开发在iOS、Android、HarmonyOS、Web（响应式）以及各类小程序平台（微信/支付宝/百度/抖音/飞书/QQ/快手/钉钉/淘宝/京东/小红书）运行的应用。

Core

核心部分

TopicDescriptionReference
Core FrameworkProject structure, platform support, condition compilationcore-framework
View Componentsview, scroll-view, swiper, movable-area, cover-viewcore-view-components
Form Componentsinput, textarea, picker, checkbox, radio, switch, slidercore-form-components
主题描述参考文档
核心框架项目结构、平台支持、条件编译core-framework
视图组件view、scroll-view、swiper、movable-area、cover-viewcore-view-components
表单组件input、textarea、picker、checkbox、radio、switch、slidercore-form-components

Features

功能特性

UI Components

UI组件

TopicDescriptionReference
Media Componentsimage, video, camera, live-player, mapfeature-media-components
Navigationnavigator, routing, page navigationfeature-navigation
UI Feedbacktoast, modal, loading, action sheet, pull refreshfeature-ui-feedback
主题描述参考文档
媒体组件image、video、camera、live-player、mapfeature-media-components
导航navigator、路由、页面导航feature-navigation
UI反馈toast、modal、loading、操作表、下拉刷新feature-ui-feedback

APIs

APIs

TopicDescriptionReference
NetworkHTTP requests, file upload/download, WebSocketfeature-network
StorageLocal storage, file system, cachingfeature-storage
System InfoDevice info, network status, screen, vibrationfeature-system-info
File OperationsImage/video selection, file system operationsfeature-file-operations
LocationGeolocation, map component, address selectionfeature-location
LifecycleApp and page lifecycle hooksfeature-lifecycle
主题描述参考文档
网络HTTP请求、文件上传/下载、WebSocketfeature-network
存储本地存储、文件系统、缓存feature-storage
系统信息设备信息、网络状态、屏幕、震动feature-system-info
文件操作图片/视频选择、文件系统操作feature-file-operations
定位地理定位、地图组件、地址选择feature-location
生命周期应用和页面生命周期钩子feature-lifecycle

Configuration

配置

TopicDescriptionReference
pages.jsonPage routing, tab bar, global styles, sub-packagesconfig-pages
manifest.jsonApp config, permissions, platform settingsconfig-manifest
主题描述参考文档
pages.json页面路由、标签栏、全局样式、分包config-pages
manifest.json应用配置、权限、平台设置config-manifest

Platform Support

平台支持

PlatformSupport Level
iOS AppFull support
Android AppFull support
HarmonyOS NextFull support
H5/WebFull support
WeChat Mini ProgramFull support
Alipay Mini ProgramFull support
Baidu Smart ProgramFull support
Douyin Mini ProgramFull support
QQ Mini ProgramFull support
Kuaishou Mini ProgramFull support
Feishu Mini ProgramFull support
JD Mini ProgramFull support
HarmonyOS Meta ServiceFull support
平台支持等级
iOS App完全支持
Android App完全支持
HarmonyOS Next完全支持
H5/Web完全支持
微信小程序完全支持
支付宝小程序完全支持
百度智能小程序完全支持
抖音小程序完全支持
QQ小程序完全支持
快手小程序完全支持
飞书小程序完全支持
京东小程序完全支持
HarmonyOS元服务完全支持

Key Concepts

关键概念

Condition Compilation

条件编译

Use special comments to write platform-specific code:
vue
<!-- #ifdef APP-PLUS -->
<view>App only</view>
<!-- #endif -->

<!-- #ifdef MP-WEIXIN -->
<view>WeChat only</view>
<!-- #endif -->
使用特殊注释编写平台专属代码：
vue
<!-- #ifdef APP-PLUS -->
<view>App only</view>
<!-- #endif -->

<!-- #ifdef MP-WEIXIN -->
<view>WeChat only</view>
<!-- #endif -->

API Promise Support

API Promise支持

Most uni-app APIs support Promise when no callback is provided:
javascript
const res = await uni.request({ url: 'https://api.example.com' })
当不提供回调函数时，大多数uni-app API支持Promise：
javascript
const res = await uni.request({ url: 'https://api.example.com' })

Cross-Platform Best Practices

跨平台最佳实践

  1. Use uni-app components and APIs instead of platform-specific ones
  2. Use condition compilation for platform-specific features
  3. Test on all target platforms
  4. Use rpx for responsive layouts
  5. Handle platform differences in manifest.json
  6. must use uni-helper tools
  1. 使用uni-app组件和API，而非平台专属组件和API
  2. 针对平台专属特性使用条件编译
  3. 在所有目标平台进行测试
  4. 使用rpx实现响应式布局
  5. 在manifest.json中处理平台差异
  6. 必须使用uni-helper工具

MCP扩展

MCP扩展

当需要查询 uni-app 官方文档时，优先调用 
search-docs-by-Uniapp-official
MCP 工具搜索相关 API 文档和使用示例。
使用场景：
  • 用户询问特定 API 的详细用法
  • 需要官方文档中的代码示例
  • 查询组件的属性和事件
  • 了解 API 的平台兼容性
工具安装： 如果检测到该 MCP 工具不可用，引导用户访问 https://github.com/uni-helper/mcp 进行安装。
当需要查询uni-app官方文档时，优先调用 
search-docs-by-Uniapp-official
MCP 工具搜索相关 API 文档和使用示例。
使用场景：
  • 用户询问特定 API 的详细用法
  • 需要官方文档中的代码示例
  • 查询组件的属性和事件
  • 了解 API 的平台兼容性
工具安装： 如果检测到该 MCP 工具不可用，引导用户访问 https://github.com/uni-helper/mcp 进行安装。