名称: uni-app项目描述: 提供全面的uni-app组件和API集成指南。当用户需要官方uni-app组件或API、想要每个组件或API的示例、或需要跨平台兼容性详细信息时使用。许可证: 完整条款在LICENSE.txt中

何时使用此技能

每当用户想要时使用此技能：

使用任何uni-app内置组件或uni-ui组件
使用任何uni-app API（网络、存储、设备、UI、导航、媒体等）
访问每个组件或API的示例，包括官方文档链接
检查组件和API的平台兼容性
使用官方模式构建跨平台uni-app应用程序

如何使用此技能

此技能的组织方式匹配官方uni-app组件和API文档：

选择组件或API类别：
- 组件 → examples/components/built-in/ 和 examples/uni-ui/
- API → examples/api/（按领域分类）
打开匹配的示例文件：
- 每个组件或API都有自己的示例文件
- 每个示例包括官方文档URL
- 示例镜像官方文档示例
当需要完整规范时使用参考：
- references/components/built-in/ 用于内置组件
- references/components/uni-ui/ 用于uni-ui组件
- references/api/ 用于API参数/返回/兼容性详细信息

示例和参考

组件（内置）

示例: examples/components/built-in/*.md
参考: references/components/built-in/*.md
官方文档: https://uniapp.dcloud.net.cn/component/

组件（uni-ui）

示例: examples/uni-ui/*.vue 和 examples/uni-ui/README.md
参考: references/components/uni-ui/*.md
官方文档: https://uniapp.dcloud.net.cn/component/uniui/uni-ui.html
插件: https://ext.dcloud.net.cn/plugin?id=55

API

示例: examples/api/{category}/*.md
参考: references/api/*.md
官方文档: https://uniapp.dcloud.net.cn/api/

最佳实践

每个组件/API一个文件：每个组件和API都有一个独立的示例文件，包含官方文档链接。
遵循平台兼容性：检查每个示例/参考中的兼容性部分。
使用条件编译：使用 #ifdef/#endif 处理平台特定逻辑。
保持示例对齐：使用官方文档示例作为真相来源。
偏好参考获取规范：使用 references/ 获取完整参数表和兼容性。

资源

组件: https://uniapp.dcloud.net.cn/component/
API: https://uniapp.dcloud.net.cn/api/
uni-ui: https://uniapp.dcloud.net.cn/component/uniui/uni-ui.html
插件市场: https://ext.dcloud.net.cn/

关键词

uniapp, uni-app, components, api, built-in components, uni-ui, examples, references, pages.json, manifest.json, H5, App, mini program, 跨平台, 组件, API, 官方文档

examples/api/network/ - 网络请求 API 示例
examples/api/storage/ - 数据存储 API 示例
examples/api/device/ - 设备信息 API 示例
examples/api/ui/ - 界面交互 API 示例
examples/api/location/ - 位置服务 API 示例
examples/api/media/ - 媒体处理 API 示例
examples/api/navigation/ - 页面路由 API 示例
examples/api/file/ - 文件操作 API 示例
examples/api/payment/ - 支付 API 示例
examples/api/share/ - 分享 API 示例
examples/api/other/ - 其他 API 示例
examples/uni-ui/ - uni-ui 组件的完整示例代码（每个组件一个独立的 .vue 文件）

使用场景：当需要查看组件或 API 的完整使用示例时，参考此目录下的示例文件。每个示例文件包含官网展示的所有示例场景，可直接复制使用。

注意：

references/ 和 examples/ 职责不同，不应合并。references/ 提供文档说明，examples/ 提供可运行代码。
每个组件和 API 都有独立的示例文件，包含原文档地址和官网全部示例
内置组件的示例代码在 examples/components/built-in/ 目录
API 的示例代码在 examples/api/ 目录，按分类组织
uni-ui 组件的完整示例代码在 examples/uni-ui/ 目录

平台支持

uni-app 支持以下平台：

H5：Web 浏览器
微信小程序：WeChat Mini Program
支付宝小程序：Alipay Mini Program
百度小程序：Baidu Smart Program
字节跳动小程序：ByteDance Mini Program
QQ 小程序：QQ Mini Program
快手小程序：Kuaishou Mini Program
App：iOS、Android（nvue、vue）
快应用：Quick App

每个组件和 API 的详细平台支持情况见对应文档。

参考资源

官方文档：https://uniapp.dcloud.net.cn/
组件文档：https://uniapp.dcloud.net.cn/component/
API 文档：https://uniapp.dcloud.net.cn/api/
插件市场：https://ext.dcloud.net.cn/
社区问答：https://ask.dcloud.net.cn/

使用示例

组件使用示例

基础组件使用示例：

<template>
  <view class="container">
    <text>{{ message }}</text>
    <button @click="handleClick">点击按钮</button>
    <image :src="imageUrl" mode="aspectFit"></image>
  </view>
</template>

<script>
export default {
  data() {
    return {
      message: 'Hello UniApp',
      imageUrl: '/static/logo.png'
    }
  },
  methods: {
    handleClick() {
      uni.showToast({
        title: '按钮被点击',
        icon: 'success' 
      })
    }
  }
}
</script>

更多组件示例：

内置组件示例：请参考官方文档或 references/components/built-in/ 目录下的组件文档
uni-ui 组件完整示例：见 examples/uni-ui/ 目录（每个组件都有独立的 .vue 示例文件）
组件详细文档：见 references/components/built-in/ 和 references/components/uni-ui/ 目录（每个组件都有独立的文档文件，包含属性、事件、平台兼容性、使用示例）

API 使用示例

// 网络请求
uni.request({
  url: 'https://api.example.com/data',
  method: 'GET',
  success: (res) => {
    console.log(res.data)
  },
  fail: (err) => {
    console.error(err)
  }
})

// 数据存储
uni.setStorage({
  key: 'userInfo',
  data: { name: 'John', age: 30 },
  success: () => {
    console.log('存储成功')
  }
})

// 页面跳转
uni.navigateTo({
  url: '/pages/detail/detail?id=123'
})

更多 API 示例：见 references/api/ 目录中的详细文档

注意事项

组件层级：原生组件（如 video、map）层级高于普通组件，需要使用 cover-view 覆盖
条件编译：使用 #ifdef、#endif 处理平台差异
生命周期：注意 uni-app 的页面生命周期和组件生命周期
样式单位：推荐使用 rpx 作为响应式单位
性能优化：合理使用组件，避免过度嵌套，注意长列表优化

名称: uni-app项目 描述: 提供全面的uni-app组件和API集成指南。当用户需要官方uni-app组件或API、想要每个组件或API的示例、或需要跨平台兼容性详细信息时使用。 许可证: 完整条款在LICENSE.txt中