vue弹窗加载另一个外部vue页面

在本页面引入另一个页面，这里不做过多的描述了，直接上代码

 <!--添加-->
<emp-add v-if="addDialogVisible" ref="empAdd"></emp-add>

import empAdd from "../../components/emp/EmpAdd";
    export default {
       name: "demo",
       components: {
            empAdd
     },

data() {
  return {            
   addDialogVisible: false
  }
},

弹窗事件

// 弹窗
showAddEmpView() {
   this.addDialogVisible = true;
   this.$nextTick(() => {
      this.$refs.empAdd.init();          
    });
 }

弹窗页面

<el-dialog
      title="弹窗"
      :visible.sync="dialogVisible"
      :close-on-click-modal="false"
           width="80%">
       <div>弹出内容</div>
</el-dialog>

data() {
  return {
    dialogVisible: false, 
   }
}

 methods: {
    init() {  
      this.initData();
      // 展示弹窗