feat: Divider component

This commit is contained in:
chenjiahan
2020-07-06 15:31:36 +08:00
parent aab12a4906
commit aa9fc7fe7c
8 changed files with 355 additions and 8 deletions
+63
View File
@@ -0,0 +1,63 @@
# Divider
### Install
```js
import Vue from 'vue';
import { Divider } from 'vant';
Vue.use(Divider);
```
## Usage
### Basic Usage
```html
<van-divider />
```
### With Text
```html
<van-divider>Text</van-divider>
```
### Content Position
```html
<van-divider content-position="left">Text</van-divider>
<van-divider content-position="right">Text</van-divider>
```
### Dashed
```html
<van-divider dashed>Text</van-divider>
```
### Custom Style
```html
<van-divider
:style="{ color: '#1989fa', borderColor: '#1989fa', padding: '0 16px' }"
>
Text
</van-divider>
```
## API
### Props
| Attribute | Description | Type | Default |
| --- | --- | --- | --- |
| dashed | Whether to use dashed border | _boolean_ | `false` |
| hairline | Whether to use hairline | _boolean_ | `true` |
| content-position | Content positioncan be set to `left` `right` | _string_ | `center` |
### Slots
| Name | Description |
| ------- | ----------- |
| default | content |