Modal support global setting
This commit is contained in:
parent
737894dee2
commit
e44ba4d4ad
4 changed files with 21 additions and 28 deletions
|
@ -12,7 +12,7 @@ import locale from '../src/locale/lang/zh-CN';
|
||||||
Vue.use(VueRouter);
|
Vue.use(VueRouter);
|
||||||
Vue.use(iView, {
|
Vue.use(iView, {
|
||||||
locale,
|
locale,
|
||||||
transfer: true,
|
transfer: false,
|
||||||
size: 'small'
|
size: 'small'
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -1,39 +1,30 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<p>
|
<Button type="primary" @click="modal1 = true">Display dialog box</Button>
|
||||||
Name: {{ value }}
|
<Modal
|
||||||
</p>
|
v-model="modal1"
|
||||||
<p>
|
title="Common Modal dialog box title"
|
||||||
<Button @click="handleRender">Custom content</Button>
|
@on-ok="ok"
|
||||||
</p>
|
@on-cancel="cancel">
|
||||||
|
<p>Content of dialog</p>
|
||||||
|
<p>Content of dialog</p>
|
||||||
|
<p>Content of dialog</p>
|
||||||
|
</Modal>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
value: ''
|
modal1: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleRender () {
|
ok () {
|
||||||
this.$Modal.confirm({
|
this.$Message.info('Clicked ok');
|
||||||
title: '真不错呀',
|
|
||||||
render: (h) => {
|
|
||||||
return h('Input', {
|
|
||||||
props: {
|
|
||||||
value: this.value,
|
|
||||||
autofocus: true,
|
|
||||||
placeholder: 'Please enter your name...'
|
|
||||||
},
|
},
|
||||||
on: {
|
cancel () {
|
||||||
input: (val) => {
|
this.$Message.info('Clicked cancel');
|
||||||
this.value = val;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -99,7 +99,9 @@
|
||||||
},
|
},
|
||||||
transfer: {
|
transfer: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true
|
default () {
|
||||||
|
return this.$IVIEW.transfer === '' ? true : this.$IVIEW.transfer;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
fullscreen: {
|
fullscreen: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
|
|
|
@ -166,7 +166,7 @@ const install = function(Vue, opts = {}) {
|
||||||
|
|
||||||
Vue.prototype.$IVIEW = {
|
Vue.prototype.$IVIEW = {
|
||||||
size: opts.size || '',
|
size: opts.size || '',
|
||||||
transfer: opts.transfer || ''
|
transfer: 'transfer' in opts ? opts.transfer : ''
|
||||||
};
|
};
|
||||||
|
|
||||||
Vue.prototype.$Loading = LoadingBar;
|
Vue.prototype.$Loading = LoadingBar;
|
||||||
|
|
Loading…
Add table
Reference in a new issue