Merge pull request #242 from rijn/241

added scrolling property to toggle CSS for creating or hiding scrollbars
This commit is contained in:
Aresn 2017-02-06 15:17:12 +08:00 committed by GitHub
commit a861963bd8
2 changed files with 20 additions and 2 deletions

View file

@ -76,6 +76,10 @@
footerHide: { footerHide: {
type: Boolean, type: Boolean,
default: false default: false
},
scrollable: {
type: Boolean,
default: false
} }
}, },
data () { data () {
@ -204,13 +208,22 @@
} else { } else {
if (this.timer) clearTimeout(this.timer); if (this.timer) clearTimeout(this.timer);
this.wrapShow = true; this.wrapShow = true;
if (!this.scrollable) {
this.addScrollEffect(); this.addScrollEffect();
} }
}
}, },
loading (val) { loading (val) {
if (!val) { if (!val) {
this.buttonLoading = false; this.buttonLoading = false;
} }
},
scrollable (val) {
if (!val) {
this.addScrollEffect();
} else {
this.removeScrollEffect();
}
} }
} }
}; };

View file

@ -5,21 +5,26 @@
</style> </style>
<template> <template>
<i-button type="primary" @click="modal1 = true">显示对话框</i-button> <i-button type="primary" @click="modal1 = true">显示对话框</i-button>
<i-button @click="scrollable = !scrollable">Toggle scrollable</i-button>
scrollable:{{scrollable}}
<Modal <Modal
:visible.sync="modal1" :visible.sync="modal1"
title="普通的Modal对话框标题" title="普通的Modal对话框标题"
:scrollable="scrollable"
@on-ok="ok" @on-ok="ok"
@on-cancel="cancel"> @on-cancel="cancel">
<p>对话框内容</p> <p>对话框内容</p>
<p>对话框内容</p> <p>对话框内容</p>
<p>对话框内容</p> <p>对话框内容</p>
<i-button @click="scrollable = !scrollable">Toggle scrollable</i-button>
</Modal> </Modal>
</template> </template>
<script> <script>
export default { export default {
data () { data () {
return { return {
modal1: false modal1: false,
scrollable: false
} }
}, },
methods: { methods: {