Vue子組件觸發父組件中的方法( 給子組件綁定自定義事件 )

永遠保持一顆學徒的心
請問你是怎么走出困境的？ 答: 多走幾步

給子組件綁定自定義事件( 使用$emit )觸發父組件中的方法,話不多說看下面代碼

< 我這里出現了異步的問題用定時器解決了也寫在下面了 >

我這里是點擊新建按鈕顯示彈窗( 新建按鈕是父組件中的，彈窗是子組件 )

然后進行新建並顯示數據問題是點擊彈窗中的提交按鈕后不及時更新所以需要調用父組件中顯示數據的方法並用定時器處理異步問題

子組件

使用$emit發出消息通知父組件
我這里是彈窗新建出現了異步不及時更新需要刷新后才可以
// 提交事件
    submitForm(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          this.$emit("abcClick");//自定義事件 此方法直接出發父組件中的顯示數據的方法
          this.newList(); //新建接口的方法
          this.$Message.success("提交成功");
          this.$refs[formName].resetFields();
          this.dialogFormVisible = false;
        } else {
          this.$Message.error("請輸入完整信息");
          return false;
        }
      });
    }

 

父組件

子組件在父組件中當做標簽使用 接收傳來的事件
<CreateVenue :isFlag="flage" @abcClick="sey"></CreateVenue>

這個事件觸發父組件中顯示數據的方法,使用定時器解決異步問題
// 子組件自定義事件
    sey() {
      setTimeout(() => {
        this.getList();//顯示數據的方法
      }, 1000);
    }