58 lines
		
	
	
		
			930 B
		
	
	
	
		
			Vue
		
	
	
			
		
		
	
	
			58 lines
		
	
	
		
			930 B
		
	
	
	
		
			Vue
		
	
	
| <template>
 | |
|   <div>
 | |
|     <div v-if="showMask" :class="maskClasses"></div>
 | |
|     <transition name="vc-fade">
 | |
|       <div v-show="visible" :class="classes">
 | |
|         <slot></slot>
 | |
|         <h1>{{visible}}</h1>
 | |
|       </div>
 | |
|     </transition>
 | |
|   </div>
 | |
| </template>
 | |
| <script>
 | |
| export default {
 | |
|   props: {
 | |
|     prefixCls: {
 | |
|       default: 'vc-dialog',
 | |
|       type: String,
 | |
|     },
 | |
|     visible: {
 | |
|       default: false,
 | |
|       type: Boolean,
 | |
|     },
 | |
|     showMask: {
 | |
|       default: false,
 | |
|       type: Boolean,
 | |
|     },
 | |
|   },
 | |
|   data () {
 | |
|     return {
 | |
|     }
 | |
|   },
 | |
|   computed: {
 | |
|     maskClasses () {
 | |
|       const { prefixCls } = this
 | |
|       return [
 | |
|         {
 | |
|           [`${prefixCls}-mask`]: true,
 | |
|         },
 | |
|       ]
 | |
|     },
 | |
|     classes () {
 | |
|       const { prefixCls } = this
 | |
|       return [
 | |
|         {
 | |
|           [`${prefixCls}-wrap`]: true,
 | |
|         },
 | |
|       ]
 | |
|     },
 | |
|   },
 | |
|   created () {
 | |
| 
 | |
|   },
 | |
|   mounted () {
 | |
|     document.body.appendChild(this.$el)
 | |
|   },
 | |
| }
 | |
| </script>
 |