VUE調用子窗口彈窗或組件彈窗，關閉彈窗刷新父級頁面主頁面，通過this.$emit來實現

this.$emit是父級向自己傳值
 第一步在父級頁面創建自己頁面的引用

<template>
  <div>
    <edit ref="edit" @refresh="search"></edit> //@refresh 這個命名可以自己改，edit是你子頁面名字  ，search是我的方法名，ref就是我調用子頁面彈窗的名字
  </div>
</template>
<script>
import Edit from "./Edit";//引用子頁面，我直接點  ./Edit是在我同一文件夾下的文件

export default {
  components: { Edit },//實例一下子頁面

 methods: {
    search(id) { //上面 @refresh調用的方法就是自己定義的
      this.axios.post("/api/xxx/xxx", this.filter).then((res) => {
      });
    },
    edit() {
      this.$refs.edit.search();//跟上面引用的子頁面 ref名字一樣exit,search是子頁面的方法
    },
}

 

第二步就簡單了在子頁面結束的時候使用父級的方法就可以了

<template>
  <el-dialog //要是彈窗就要加不然不能識別問彈窗，不然就是跳轉頁面或者報錯
    :title="title"//頁面左上角彈窗名字
    :visible.sync="visible" //彈窗顯示或者關閉
    :modal-append-to-body="false" 
    :close-on-click-modal="false" 
  >
    </el-dialog>
</template>
export default {
  data() {
    return {
      title: "", 
      visible: false,
    };
  },
    search(id) { //父級頁面this.$refs.edit.search();調用的search就是自己定義的
    this.visible=true;//讓彈窗顯示出來
    this.title='給彈窗命名';
      this.axios.post("/api/xxx/xxx", this.filter).then((res) => {
      
      就是這里往這里看
       this.$emit("refresh", 1);//這就是刷新子集，調用父級@refresh的名字，
       //父級就會調用寫好的方法，后面的1就是往方法里面傳參數，也可以不寫
       
      this.$emit("refresh"); //這是不用傳參數的
      
       this.visible=false;//最后關閉彈窗子頁面
      });
    },

 

希望上述能幫助到你