An open API service indexing awesome lists of open source software.

https://github.com/mxdi9i7/vant-react

Lightweight 2kb Mobile UI Components built on React and TS, inspired by Vant@https://github.com/youzan/vant
https://github.com/mxdi9i7/vant-react

components-library react ui-components ui-library vant vant-ui web-components

Last synced: 2 months ago
JSON representation

Lightweight 2kb Mobile UI Components built on React and TS, inspired by Vant@https://github.com/youzan/vant

Awesome Lists containing this project

README

        

# **Vant React**

[![npm version](https://badge.fury.io/js/vant-react.svg)](https://badge.fury.io/js/vant-react)
[![NPM](https://img.shields.io/npm/l/vant-react)](LICENSE)
![Test CI](https://github.com/mxdi9i7/vant-react/workflows/Test%20CI/badge.svg)
[![Netlify Status](https://api.netlify.com/api/v1/badges/30ddabc0-3eb6-4530-ab08-58db247a2b48/deploy-status)](https://vant.bctc.io)
[![Storybook](https://cdn.jsdelivr.net/gh/storybookjs/brand@master/badge/badge-storybook.svg)](https://vant.bctc.io)

Lightweight Mobile UI Components built on Typescript and React in under 2kb!

## **Features**

- Support Typescript
- 60+ Reusable components
- 100% Storybook coverage: [https://vant.bctc.io](https://vant.bctc.io)
- Extensive documentation and demos

## Install

```text
# Using npm
npm i vant-react -S

# Using yarn
yarn add vant-react
```

## Quickstart

```text
import React from 'react';
import { Button } from 'vant-react';
import 'vant-react/dist/index.css';

const App = () => {
return (

);
};
```

## Components completion status

### Basic Components

- [x] Button
- [x] Cell
- [x] Icon
- [x] Image
- [ ] Layout
- [x] Popup
- [x] Built-in style
- [x] Toast

### Form Components

- [ ] Calendar
- [ ] Cascader
- [x] Checkbox
- [ ] DatetimePicker
- [x] Field
- [ ] Form
- [ ] NumberKeyboard
- [ ] PasswordInput
- [ ] Picker
- [x] Radio
- [x] Rate
- [x] Search
- [x] Slider
- [x] Stepper
- [x] Switch
- [ ] Uploader

### Action Components

- [ ] ActionSheet
- [ ] Dialog
- [ ] DropdownMenu
- [x] Loading
- [ ] Notify
- [ ] Overlay
- [ ] PullRefresh
- [ ] ShareSheet
- [ ] SwipeCell

### Display Components

- [ ] Badge
- [ ] Circle
- [ ] Collapse
- [ ] CountDown
- [x] Divider
- [ ] Empty
- [ ] ImagePreview
- [ ] Lazyload
- [ ] List
- [ ] NoticeBar
- [ ] Popover
- [ ] Progress
- [ ] Skeleton
- [ ] Steps
- [ ] Sticky
- [ ] Swipe
- [x] Tag

### Navigation Components

- [ ] Grid
- [ ] IndexBar
- [x] NavBar
- [ ] Pagination
- [ ] Sidebar
- [ ] Tab
- [ ] Tabbar
- [ ] TreeSelect

### Business Components

- [ ] AddressEdit
- [ ] AddressList
- [ ] Area
- [ ] Card
- [ ] ContactCard
- [ ] ContactEdit
- [ ] ContactList
- [ ] Coupon
- [ ] GoodsAction
- [ ] SubmitBar
- [ ] Sku

### Deprecated

- [ ] SwitchCell
- [ ] Panel

## Contribution

If you like what we do, please consider buy us a bubble-tea(donate)!

[![DonorBox](https://d1iczxrky3cnb2.cloudfront.net/button-small-blue.png)](https://donorbox.org/vant-react-dev-team?default_interval=o&amount=5)

Please make sure to read the[ Contributing Guide](./CONTRIBUTION.md) before making a pull request.

Or, join our discussion group on Wechat by adding me!

![Wechat QR code](https://github.com/mxdi9i7/Vant-react-docs/blob/master/.gitbook/assets/qr.png)

## Browser Support

Modern browsers and Android 4.0+, iOS 8.0+.

## Open Source License

This is an Open Source Software operating under the [MIT](https://github.com/mxdi9i7/vant-react/blob/master/LICENSE) License.