CD Design Mobile
✨ 特性
📦 开箱即用的 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
- [x] ActionSheet 上拉菜单
- [x] Badge 徽标数
- [x] Button 按钮
- [x] Card 卡片
- [x] Checkbox 复选框
- [x] Coupon 优惠券
- [x] Divider 分割线
- [x] Dialog 对话框
- [x] Drawer 抽屉
- [x] Dropdown 下拉菜单
- [x] Empty 空状态
- [x] Grid 栅格
- [x] Icon 图标
- [x] Image 图片
- [x] Input 输入框
- [x] List 列表
- [x] NumberInput 数字输入框
- [x] Radio 单选框
- [x] Rate 评分
- [x] SearchBar 搜索栏
- [x] Steps 步骤条
- [x] Switch 开关
- [x] Tabs 标签页
- [x] Tag 标签
- [x] Textarea 多行输入框
- [x] Timeline 时间轴
- [x] Toast 消息提示
- [x] Toolbar 工具栏
⌨️ 本地开发
克隆到本地开发:
$ git clone https://github.com/YutLee/cd-design-mobile.git
$ cd cd-design-mobile
$ yarn
$ yarn start
打开浏览器访问 http://127.0.0.1:3000