本次跨页面实现弹出窗口
1.现在第一个页面中引用,需要弹出的页面(实现点击企业信息添加弹出一个窗口)
<template>
<div>
<addEnterprise ref="addEnterprise"/>
<Button @click="add_enterprise">企业信息添加</Button>
</div>
</template>
<script>
import addEnterprise from "./addEnterprise";//页面路径
export default {
name: "Enterprise",
components:{
addEnterprise
}
methods:{
add_enterprise() {//修改企业信息
this.$refs.addEnterprise.init("企业信息");//注意上方模板中要有ref="addEnterprise"
//init是addEnterprise页面的方法
}
}
}
</script>
2.创建弹出窗口页面弹出窗口页面(此路径为同目录下的addenterprise.vue)
<template>
<div>
<drawer title="企业信息" v-model="addenterprise"
width="720" :mask-closable="false" :styles="styles">
//页面内容
</drawer>
</div>
</template>
<script>
export default {
name: "contacts",
data () {
return {
addenterprise: false
}
},
methods: {
init(title){//初始化方法
this.addenterprise=true;//addenterprise此变量控制此页面的显示
}
}
}
</script>