用途
该技能用于在开发 uni-app 应用时,快速查找内置组件、uni-ui 组件和相关 API 的示例与参考文档。当用户需要使用任何 uni-app 内置组件或 uni-ui 组件、使用任何 uni-app API(网络、存储、设备、UI、导航、媒体等)、访问按组件或按 API 的示例与官方文档链接、核对组件与 API 的平台兼容性,或按照官方模式构建跨平台 uni-app 应用时,均可使用此技能。
主要能力
技能的组织方式与 uni-app 官方组件和 API 文档相对应:
- 组件部分:内置组件示例位于 examples/components/built-in/ 与 examples/uni-ui/;内置组件文档位于 references/components/built-in/,uni-ui 组件文档位于 references/components/uni-ui/。
- API 部分:示例位于 examples/api/(按领域分类),文档位于 references/api/。
- 每个组件或 API 都有独立的示例文件,示例文件中包含官方文档 URL,示例内容与官方文档示例保持一致。
- 需要完整规格(参数表、返回值、兼容性)时使用 references/ 目录。
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 分类:组件查看 examples/components/built-in/ 与 examples/uni-ui/;API 查看 examples/api/(按领域分类)。
- 打开匹配的示例文件:每个组件或 API 有独立示例文件,包含官方文档 URL,示例与官方文档示例一致。
- 需要完整规格时查阅 references/:内置组件见 references/components/built-in/,uni-ui 组件见 references/components/uni-ui/,API 参数、返回值与兼容性见 references/api/。
最佳实践:
- 一个组件/API 一个文件:每个组件和 API 均有独立示例文件,并附官方文档链接。
- 遵循平台兼容性:查看每个示例或参考中的兼容性说明。
- 使用条件编译:平台特定逻辑使用 #ifdef/#endif。
- 保持示例一致:以官方文档示例为事实来源。
- 规格优先查 references/:完整参数表与兼容性使用 references/。
适用场景
- 需要查看组件或 API 的完整使用示例时,参考 examples/ 下的示例文件,每个示例文件包含官网展示的示例场景。
- 需要使用 uni-app 组件、API 并按官方模式进行跨平台开发时。
- 需要核对某组件或 API 在不同平台的兼容性时。
平台支持
uni-app 支持以下平台,每个组件和 API 的详细平台支持情况见对应文档:
- H5:Web 浏览器
- 微信小程序
- 支付宝小程序
- 百度小程序
- 字节跳动小程序
- QQ 小程序
- 快手小程序
- App:iOS、Android(nvue、vue)
- 快应用
限制与注意事项
- 组件层级:原生组件(如 video、map)层级高于普通组件,需要使用 cover-view 覆盖。
- 条件编译:使用 #ifdef、#endif 处理平台差异。
- 生命周期:注意 uni-app 的页面生命周期和组件生命周期。
- 样式单位:推荐使用 rpx 作为响应式单位。
- 性能优化:合理使用组件,避免过度嵌套,注意长列表优化。
- references/ 与 examples/ 职责不同,不应合并:references/ 提供文档说明,examples/ 提供可运行代码。
- 关于该技能的收费、价格等信息,资料中暂未提供。
参考资源
官方文档:https://uniapp.dcloud.net.cn/ 组件文档: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 uni-ui 插件:https://ext.dcloud.net.cn/plugin?id=55 插件市场:https://ext.dcloud.net.cn/ 社区问答:https://ask.dcloud.net.cn/