CD Design Mobile

一套基于 React 和 Typescript 的 UI 组件库。

✨ 特性

• 📦 开箱即用的 React 移动端 UI 组件。
• 🛡 使用 TypeScript 开发，提供完整的类型定义文件。

🖥 兼容环境

• 现代浏览器。

Edge	Firefox	Chrome	Safari
Edge	last 2 versions	last 2 versions	last 2 versions

📦 安装

npm install cd-design-mobile --save

yarn add cd-design-mobile

🔨 示例

import { Button, Rate } from 'cd-design-mobile'

const App = () => (
  <>
    <Button type="primary">按一下试试</Button>
    <Rate disabled />
  </>
)

引入样式：

import 'cd-design-mobile/css'

🔗 链接

• Demo
• ActionSheet 上拉菜单
• Badge 徽标数
• Button 按钮
• Card 卡片
• Checkbox 复选框
• Coupon 优惠券
• Divider 分割线
• Dialog 对话框
• Drawer 抽屉
• Dropdown 下拉菜单
• Empty 空状态
• Grid 栅格
• Icon 图标
• Image 图片
• Input 输入框
• List 列表
• NumberInput 数字输入框
• Radio 单选框
• Rate 评分
• SearchBar 搜索栏
• Steps 步骤条
• Switch 开关
• Tabs 标签页
• Tag 标签
• Textarea 多行输入框
• Timeline 时间轴
• Toast 消息提示
• Toolbar 工具栏
• [BackTop 回到顶部]
• Tree 树形控件
• Pagination 分页
• List 列表
• Typography 排版
• Layout 布局
• Space 间距
• Affix 固钉
• Breadcrumb 面包屑
• Dropdown 下拉菜单
• Menu 导航菜单
• PageHeader 页头
• AutoComplete 自动完成
• Cascader 级联选择
• DatePicker 日期选择
• From 表单
• Mentions 提及
• Slider 滑动输入条
• TimePicker 时间选择框
• Transfer 穿梭框
• TreeSelect 树选择
• Calendar 日历
• Carousel 走马灯
• Collapse 折叠面板
• Comment 评论
• Descriptions 描述列表
• Popover 气泡卡片
• Statistic 统计数值
• Table 表格
• Tooltip 文字提示
• Alert 警告提示
• Notification 通知提醒框
• Popconfirm 气泡确认框
• Progress 进度条
• Result 结果
• Skeleton 骨架屏
• Spin 加载中
• Anchor 锚点
• ConfigProvider 全局化配置

⌨️ 本地开发

克隆到本地开发:

$ git clone https://github.com/YutLee/cd-design-mobile.git
$ cd cd-design-mobile
$ yarn
$ yarn start

打开浏览器访问 http://127.0.0.1:3000