Ant Design Mobile：React 移动端组件库怎么选

Ant Design Mobile 是蚂蚁出品的 React 移动端组件库，针对移动端做了专门优化：触控面积、手势、滚动性能都按手机场景调过，组件覆盖列表、表单、弹窗、抽屉、日期选择等常见移动交互。

它解决什么问题

桌面组件库直接搬到手机上，触控目标太小、滚动卡顿，体验很差。

移动 H5 要一套和 Ant Design 视觉一致、又针对触屏优化的组件并不好找。

核心能力

只做移动端这件事

Ant Design Mobile 的定位非常明确：移动端 H5。它把桌面 Ant Design 的视觉搬到手机上，并针对触屏手感做了大量优化，而不是简单缩小。

所以如果你的产品是桌面端后台，请回到 Ant Design 本身；如果是 React 技术栈的移动 H5，它是最顺手的那一个。两者分工清晰，不要跨场景混用。

同类工具怎么选

谁适合用

• 用 React、做移动端 H5 产品的前端团队
• 需要触屏优化、手势流畅的移动界面的人
• 已有 Ant Design 视觉体系、要延伸到手机端的产品

怎么开始

1. npm install antd-mobile，按需引入组件（如 Button、DatePicker）。
2. 在入口引入基础样式，或开启按需加载减少包体。
3. 用 List、Form 等组件搭移动表单与列表。
4. 下拉刷新、手势等交互直接调用，无需额外库。
5. 暗色模式与国际化按文档配置主题变量与 locale。

常见问题

和 Ant Design 能共用吗？
视觉一脉相承，但这是移动端专用版；桌面端请用 Ant Design，不要混用。

只支持 React 吗？
是，它是 React 组件库，Vue 项目请用 Vant / Varlet 等。

桌面端能用吗？
不建议。它针对触屏优化，桌面场景用原版 Ant Design 更合适。

授权与合规

Ant Design Mobile 以 MIT 协议开源，商业与闭源项目均可免费使用；派生修改保留版权声明，整体可嵌入商用产品。 官网：mobile.ant.design。