alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

docs: prettier all markdown files

Browse Source
This commit is contained in:
chenjiahan
2020-04-11 09:17:33 +08:00
committed by neverland
parent 48067f79db
commit 7f84f8a487
140 changed files with 4441 additions and 4723 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/dialog/README.md
+74 -72
View File
@@ -18,13 +18,13 @@ Used to prompt for some messages, only including one confirm button
```js
Dialog.alert({
title: 'Title',
message: 'Content'
message: 'Content',
}).then(() => {
// on close
});
Dialog.alert({
message: 'Content'
message: 'Content',
}).then(() => {
// on close
});
@@ -35,14 +35,16 @@ Dialog.alert({
Used to confirm some messages, including a confirm button and a cancel button
```js
Dialog.confirm({
Dialog.confirm({
title: 'Title',
message: 'Content'
}).then(() => {
// on confirm
}).catch(() => {
// on cancel
});
message: 'Content',
})
.then(() => {
// on confirm
})
.catch(() => {
// on cancel
});
```
### Asnyc Close
@@ -59,22 +61,22 @@ function beforeClose(action, done) {
Dialog.confirm({
title: 'Title',
message: 'Content',
beforeClose
beforeClose,
});
```
### $dialog Method
### \$dialog Method
After import the Dialog component, the $dialog method is automatically mounted on Vue.prototype, making it easy to call within a vue component.
After import the Dialog component, the \$dialog method is automatically mounted on Vue.prototype, making it easy to call within a vue component.
```js
export default {
mounted() {
this.$dialog.alert({
message: 'Content'
message: 'Content',
});
}
}
},
};
```
### Advanced Usage
@@ -83,7 +85,7 @@ If you need to render vue components within a dialog, you can use dialog compone
```html
<van-dialog v-model="show" title="Title" show-cancel-button>
<img src="https://img.yzcdn.cn/vant/apple-3.jpg">
<img src="https://img.yzcdn.cn/vant/apple-3.jpg" />
</van-dialog>
```
@@ -91,10 +93,10 @@ If you need to render vue components within a dialog, you can use dialog compone
export default {
data() {
return {
show: false
show: false,
};
}
}
},
};
```
## API
@@ -102,7 +104,7 @@ export default {
### Methods
| Name | Description | Attribute | Return value |
|------|------|------|------|
| --- | --- | --- | --- |
| Dialog | Show dialog | `options` | `Promise` |
| Dialog.alert | Show alert dialog | `options` | `Promise` |
| Dialog.confirm | Show confim dialog | `options` | `Promise` |
@@ -113,68 +115,68 @@ export default {
### Options
| Attribute | Description | Type | Default |
|------|------|------|------|
| title | Title | *string* | - |
| width `v2.2.7` | Width | *number \| string* | `320px` |
| message | Message | *string* | - |
| messageAlign | Message text align，can be set to `left` `right` | *string* | `center` |
| className | Custom className | *any* | - |
| showConfirmButton | Whether to show confirm button | *boolean* | `true` |
| showCancelButton | Whether to show cancel button | *boolean* | `false` |
| cancelButtonText | Cancel button text | *string* | `Cancel` |
| cancelButtonColor | Cancel button color | *string* | `black` |
| confirmButtonText | Confirm button text | *string* | `Confirm` |
| confirmButtonColor | Confirm button color | *string* | `#1989fa` |
| overlay | Whether to show overlay | *boolean* | `true` |
| overlayClass `v2.2.7` | Custom overlay class | *string* | - |
| overlayStyle `v2.2.7` | Custom overlay style | *object* | - |
| closeOnPopstate `v2.0.5` | Whether to close when popstate | *boolean* | `false` |
| closeOnClickOverlay | Whether to close when click overlay | *boolean* | `false` |
| lockScroll | Whether to lock body scroll | *boolean* | `true` |
| --- | --- | --- | --- |
| title | Title | _string_ | - |
| width `v2.2.7` | Width | _number \| string_ | `320px` |
| message | Message | _string_ | - |
| messageAlign | Message text align，can be set to `left` `right` | _string_ | `center` |
| className | Custom className | _any_ | - |
| showConfirmButton | Whether to show confirm button | _boolean_ | `true` |
| showCancelButton | Whether to show cancel button | _boolean_ | `false` |
| cancelButtonText | Cancel button text | _string_ | `Cancel` |
| cancelButtonColor | Cancel button color | _string_ | `black` |
| confirmButtonText | Confirm button text | _string_ | `Confirm` |
| confirmButtonColor | Confirm button color | _string_ | `#1989fa` |
| overlay | Whether to show overlay | _boolean_ | `true` |
| overlayClass `v2.2.7` | Custom overlay class | _string_ | - |
| overlayStyle `v2.2.7` | Custom overlay style | _object_ | - |
| closeOnPopstate `v2.0.5` | Whether to close when popstate | _boolean_ | `false` |
| closeOnClickOverlay | Whether to close when click overlay | _boolean_ | `false` |
| lockScroll | Whether to lock body scroll | _boolean_ | `true` |
| beforeClose | Callback before close,<br>call done() to close dialog,<br>call done(false) to cancel loading | (action: string, done: Function) => void | - |
| transition `v2.2.6` | Transition, equivalent to `name` prop of [transtion](https://vuejs.org/v2/api/#transition) | *string* | - |
| getContainer | Return the mount node for Dialog | *string \| () => Element* | `body` |
| transition `v2.2.6` | Transition, equivalent to `name` prop of [transtion](https://vuejs.org/v2/api/#transition) | _string_ | - |
| getContainer | Return the mount node for Dialog | _string \| () => Element_ | `body` |
### Props
| Attribute | Description | Type | Default |
|------|------|------|------|
| v-model | Whether to show dialog | *boolean* | - |
| title | Title | *string* | - |
| width `v2.2.7` | Width | *number \| string* | `320px` |
| message | Message | *string* | - |
| message-align | Message align，can be set to `left` `right` | *string* | `center` |
| show-confirm-button | Whether to show confirm button | *boolean* | `true` |
| show-cancel-button | Whether to show cancel button | *boolean* | `false` |
| cancel-button-text | Cancel button text | *string* | `Cancel` |
| cancel-button-color | Cancel button color | *string* | `black` |
| confirm-button-text | Confirm button text | *string* | `Confirm` |
| confirm-button-color | Confirm button color | *string* | `#1989fa` |
| overlay | Whether to show overlay | *boolean* | `true` |
| overlay-class `v2.2.7` | Custom overlay class | *string* | - |
| overlay-style `v2.2.7` | Custom overlay style | *object* | - |
| close-on-popstate `v2.0.5` | Whether to close when popstate | *boolean* | `false` |
| close-on-click-overlay | Whether to close when click overlay | *boolean* | `false` |
| lazy-render | Whether to lazy render util appeared | *boolean* | `true` |
| lock-scroll | Whether to lock background scroll | *boolean* | `true` |
| --- | --- | --- | --- |
| v-model | Whether to show dialog | _boolean_ | - |
| title | Title | _string_ | - |
| width `v2.2.7` | Width | _number \| string_ | `320px` |
| message | Message | _string_ | - |
| message-align | Message align，can be set to `left` `right` | _string_ | `center` |
| show-confirm-button | Whether to show confirm button | _boolean_ | `true` |
| show-cancel-button | Whether to show cancel button | _boolean_ | `false` |
| cancel-button-text | Cancel button text | _string_ | `Cancel` |
| cancel-button-color | Cancel button color | _string_ | `black` |
| confirm-button-text | Confirm button text | _string_ | `Confirm` |
| confirm-button-color | Confirm button color | _string_ | `#1989fa` |
| overlay | Whether to show overlay | _boolean_ | `true` |
| overlay-class `v2.2.7` | Custom overlay class | _string_ | - |
| overlay-style `v2.2.7` | Custom overlay style | _object_ | - |
| close-on-popstate `v2.0.5` | Whether to close when popstate | _boolean_ | `false` |
| close-on-click-overlay | Whether to close when click overlay | _boolean_ | `false` |
| lazy-render | Whether to lazy render util appeared | _boolean_ | `true` |
| lock-scroll | Whether to lock background scroll | _boolean_ | `true` |
| before-close | Callback before close,<br>call done() to close dialog,<br>call done(false) to cancel loading | (action: string, done: Function) => void | - |
| transition `v2.2.6` | Transition, equivalent to `name` prop of [transtion](https://vuejs.org/v2/api/#transition) | *string* | - |
| get-container | Return the mount node for Dialog | *string \| () => Element* | - |
| transition `v2.2.6` | Transition, equivalent to `name` prop of [transtion](https://vuejs.org/v2/api/#transition) | _string_ | - |
| get-container | Return the mount node for Dialog | _string \| () => Element_ | - |
### Events
| Event | Description | Parameters |
|------|------|------|
| confirm | Triggered when click confirm button | - |
| cancel | Triggered when click cancel button | - |
| open | Triggered when open Dialog | - |
| close | Triggered when close Dialog | - |
| opened | Triggered when opened Dialog | - |
| closed | Triggered when closed Dialog | - |
| Event | Description | Parameters |
| ------- | ----------------------------------- | ---------- |
| confirm | Triggered when click confirm button | - |
| cancel | Triggered when click cancel button | - |
| open | Triggered when open Dialog | - |
| close | Triggered when close Dialog | - |
| opened | Triggered when opened Dialog | - |
| closed | Triggered when closed Dialog | - |
### Slots
| Name | Description |
|------|------|
| Name | Description |
| ------- | -------------- |
| default | Custom message |
| title | Custom title |
| title | Custom title |