[Improvement] Dialog: support custom className (#1224)

This commit is contained in:
neverland 2018-06-05 11:57:52 +08:00 committed by GitHub
parent b33c8ef5f2
commit 9b3b17cb42
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 11 additions and 7 deletions

View File

@ -1,6 +1,6 @@
<template> <template>
<transition name="van-dialog-bounce"> <transition name="van-dialog-bounce">
<div v-show="value" :class="b()"> <div v-show="value" :class="[b(), className]">
<div v-if="title" v-text="title" :class="b('header')" /> <div v-if="title" v-text="title" :class="b('header')" />
<div :class="b('content')" class="van-hairline"> <div :class="b('content')" class="van-hairline">
<slot> <slot>
@ -49,6 +49,7 @@ export default create({
title: String, title: String,
message: String, message: String,
callback: Function, callback: Function,
className: [String, Object, Array],
beforeClose: Function, beforeClose: Function,
confirmButtonText: String, confirmButtonText: String,
cancelButtonText: String, cancelButtonText: String,

View File

@ -70,9 +70,10 @@ export default {
|-----------|-----------|-----------|-------------| |-----------|-----------|-----------|-------------|
| title | Title | `String` | - | | title | Title | `String` | - |
| message | Message | `String` | - | | message | Message | `String` | - |
| showConfirmButton | Whether to show confirm button | `Boolean` | `true` | | className | Custom className | `String | Array | Object` | - |
| showCancelButton | Whether to show cancel button | `Boolean` | `false` | | showConfirmButton | Whether to show confirm button | `Boolean` | `true` |
| confirmButtonText | Confirm button text | `String` | `Confirm` | | showCancelButton | Whether to show cancel button | `Boolean` | `false` |
| confirmButtonText | Confirm button text | `String` | `Confirm` |
| cancelButtonText | Cancel button test | `String` | `Cancel` | | cancelButtonText | Cancel button test | `String` | `Cancel` |
| overlay | Whether to show overlay | `Boolean` | `true` | | overlay | Whether to show overlay | `Boolean` | `true` |
| closeOnClickOverlay | Whether to close when click overlay | `Boolean` | `false` | | closeOnClickOverlay | Whether to close when click overlay | `Boolean` | `false` |

View File

@ -34,6 +34,7 @@ Dialog.defaultOptions = {
title: '', title: '',
message: '', message: '',
overlay: true, overlay: true,
className: '',
lockScroll: true, lockScroll: true,
beforeClose: null, beforeClose: null,
confirmButtonText: '', confirmButtonText: '',

View File

@ -71,9 +71,10 @@ export default {
|-----------|-----------|-----------|-------------| |-----------|-----------|-----------|-------------|
| title | 标题 | `String` | - | | title | 标题 | `String` | - |
| message | 内容 | `String` | - | | message | 内容 | `String` | - |
| showConfirmButton | 是否展示确认按钮 | `Boolean` | `true` | | className | 自定义类名 | `String | Array | Object` | - |
| showCancelButton | 是否展示取消按钮 | `Boolean` | `false` | | showConfirmButton | 是否展示确认按钮 | `Boolean` | `true` |
| confirmButtonText | 确认按钮的文案 | `String` | `确认` | | showCancelButton | 是否展示取消按钮 | `Boolean` | `false` |
| confirmButtonText | 确认按钮的文案 | `String` | `确认` |
| cancelButtonText | 取消按钮的文案 | `String` | `取消` | | cancelButtonText | 取消按钮的文案 | `String` | `取消` |
| overlay | 是否展示蒙层 | `Boolean` | `true` | | overlay | 是否展示蒙层 | `Boolean` | `true` |
| closeOnClickOverlay | 点击蒙层时是否关闭弹窗 | `Boolean` | `false` | | closeOnClickOverlay | 点击蒙层时是否关闭弹窗 | `Boolean` | `false` |