主要思路:父页面监听弹窗的dialogVisible属性,如果发生变化则调用获取表格信息的函数。

1.data中的主要字段:

edit: {
        dialogVisible: false,
        id: ''
      },

2.弹窗:

<el-button 
              v-waves
              :loading="scope.row.id == loading.update"
              :disabled="!checkPermission(['larke-admin.auth-rule.update'])" 
              type="primary" 
              size="mini" 
              icon="el-icon-edit" 
              @click="handleEdit(scope.$index, scope.row)"
            >
              {{ $t('编辑') }}
            </el-button>

3.打开弹窗的函数

handleEdit(index, row) {
      this.loading.update = row.id

      this.edit.dialogVisible = true
      this.edit.id = row.id

      this.loading.update = ''
      // this.getList()
    },

4.监听。由于我们这里需要监听的data中的对象的字段,所以需要借助computed函数。

computed: {
    editA() {
        return JSON.parse(JSON.stringify(this.edit.dialogVisible));
    },
 },
  watch: {
    editA: function(newVal, oldVal) {
        // TO DO
        // console.log("newVal:", newVal);
        // console.log("oldVal:", oldVal);
        // 刷新表格  getList()是获取表格信息的函数
        this.getList()
    }
  },

🆗

Logo

前往低代码交流专区

更多推荐