PC官网:https://ant.design/

移动端网址:https://mobile.ant.design/docs/react/introduce-cn

antd-mobile :是 Ant Design 的移动规范的 React 实现,服务于蚂蚁及口碑无线业务。

特性和优势:

  • UI 样式高度可配置,拓展性更强,轻松适应各类产品风格

  • 基于 React Native 的 iOS / Android / Web 多平台支持,组件丰富、能全面覆盖各类场景 (antd-mobile-rn)

  • 提供 "组件按需加载" / "Web 页面高清显示" / "SVG Icon" 等优化方案,一体式开发

  • 使用 TypeScript 开发,提供类型定义文件,支持类型及属性智能提示,方便业务开发

  • 全面兼容 react / preact

适用场景:

  • 适合于中大型产品应用

  • 适合于基于 react / preact / react-native 的多终端应用

  • 适合不同 UI 风格的高度定制需求的应用


1.创建一个项目 
可以是已有项目,或者是使用 dva / create-react-app 新创建的空项目,你也可以从 官方示例 脚手架里拷贝并修改

2.create-react-app里的使用安装
$ npm install antd-mobile --save

(1)、添加html代码;改写js代码

1.webpack.config.js安装loader

react的ant design的UI组件库的更多相关文章

  1. Ant Design of Vue 组件库的使用

    文档里面很清楚 安装步骤    这是全部引入的 1  有的组价涉及到汉化的问题 import moment from 'moment' import '../../../../node_modules ...

  2. 16款优秀的Vue UI组件库推荐

    16款优秀的Vue UI组件库推荐 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基 ...

  3. [转载]前端——实用UI组件库

    https://www.cnblogs.com/xuepei/p/7920888.html Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https:/ ...

  4. 强烈推荐优秀的Vue UI组件库

    Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基于Vue的UI组件框架开发,并投入正 ...

  5. ui组件库

    基于Vue的Quasar Framework 中文网 http://www.quasarchs.com/ quasarframework/quasar: Quasar Frameworkhttps:/ ...

  6. 【转】优秀的Vue UI组件库

    原文来源:https://www.leixuesong.com/3342 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司 ...

  7. Vue UI组件库

    1. iView UI组件库  iView官网:https://www.iviewui.com/ 2.Vux UI组件库   Vux官网:https://vux.li/ 3.Element UI组件库 ...

  8. 基于React Native的Material Design风格的组件库 MRN

    基于React Native的Material Design风格的组件库.(为了平台统一体验,目前只打算支持安卓) 官方网站 http://mrn.js.org/ Github https://git ...

  9. react_app 项目开发 (4)_ React UI 组件库 ant-design 的基本使用

    最流行的开源 React UI 组件库 material-ui 国外流行(安卓手机的界面效果)文档 ant-design 国内流行 (蚂蚁金服 设计,一套 PC.一套移动端的____下拉菜单.分页.. ...

随机推荐

  1. Groovy xlsx

    如果在JMeter安装的“bin”文件夹下有Excel(xlsx)文件,则test.xlsx可以使用以下方法动态填充请求参数: 将tika-app.jar添加到JMeter Classpath 重新启 ...

  2. JS事件之鼠标悬浮窗(鼠标悬浮窗抖动问题的解决)

    鼠标进入显示悬浮窗,思路有简单有困难. 首先要注意的是我们要给悬浮窗设置position为absolute,不然我们改了 style.left style.top发现没有变化很尴尬.其余的内容看起来就 ...

  3. redmine迁移

    (redmine使用的是bitnamiredmine一键安装,环境为apache+mysql+php) 在新环境中一键安装bitnamiredmine,安装完后,执行下面操作 1.备份原环境数据库,恢 ...

  4. Unity WWW下载图片并保存到Unity的Assets下

    1.新建一个UGUI的Image. 2.新建一个脚本wwwTest.cs: using System.Collections; using System.Collections.Generic; us ...

  5. (转)不看绝对后悔的Linux三剑客之awk实战精讲

    原文:http://blog.51cto.com/hujiangtao/1923930 一.Linux三剑客之awk命令精讲 第1章 awk基础入门 1.1 awk简介 awk不仅仅时linux系统中 ...

  6. 使用PM2守护Node.js应用

    PM2简介 PM2是node进程管理工具,可以利用它来简化很多node应用管理的繁琐任务,如性能监控.自动重启.负载均衡等,而且使用非常简单.   安装PM2 $ npm install pm2 -g ...

  7. java实现定时任务(Quartz)

    java中实现定时任务执行某一业务.具体操作如下: 1.定义初始化任务 2.任务业务操作 3.定义初始化方法 4.在web.xml中注册启动 5.定义具体执行时间 6.quartz定时任务时间设置 q ...

  8. ElasticsearchIllegalArgumentException[failed to find analyzer [ik]]问题解决

    ElasticsearchIllegalArgumentException[failed to find analyzer [ik]] 没有找到分词器 请查看本博客经得住实践的文章:http://bl ...

  9. LESS CSS非常实用实例应用

    @charset "UTF-8"; @base-color:#333; // 圆角 .border-radius (@radius: 5px) { -webkit-border-r ...

  10. Vue-mixins选项

    Vue-mixins选项 Mixins用于: 1.已经写好了构造器,还要增加方法或者临时的活动时使用的方法,用混入能减少源代码的污染. 2.公用方法,用混入的方法可以减少代码量,实现代码重用.(使用全 ...