vue--使用layer弹出框方法

vue–使用layer弹出框方法

demo.vue

<template>
	<div v-if="visible">
		<div>
		这个是layer弹出框的内容
		</div>
	</div>
</template>
<script>
	export default {
		data() {
			return {
				visible: false
			};
		},
		methods: {
		},
		mounted() {
			console.log("添加");
		},
		beforeDestroy() {
			console.log("删除");
		}
	}
</script>
<style lang="scss">
</style>

pop.js

import Vue from 'vue';
import demo from './demo.vue';
const demoClass= Vue.extend(demo);

let pop= new demoClass({
		data: {
			visible: true
		}
	});
	pop.$mount();
	document.body.appendChild(pop.$el);
	pop.$nextTick(() => {
		layer.open({
			type: 1,
			title: "弹出框例子",
			shade: [0.2, '#000'],
			area: ['320px', '180px'],
			content: $(pop.$el),
			end: function() {
				document.body.removeChild(pop.$el);
				pop.$destroy();
				pop=null;
			}
		});
	});

混用，需要先引入layer和jQuery。