Element-ui的氣泡框如何在@onConfirm方法中調用元素上特定的值

緣由：想做一個刪除按鈕有提示，然后糾結了半天還是用了Element-ui的氣泡框。首先修改了<el-button>的padding來修改按鈕大小。

效果：

然后問題是要通過刪除后的氣泡框的確認事件來刪除某個收藏夾，但是如何動態獲取這個數據呢？
我人傻，還是像用ev.currentTarget.dataset.xx的方法，過了1個多小時才發覺這個方法是放在element-ui的標簽上的，它是被封裝過的，一加載所有元素都變化了。

然后又過了半小時，我想到可以利用<el-button>的方法來傳值，結果發現在氣泡框方法中調用按鈕的方法其實是調用了兩次的，好吧，再把值先放在vue的data里面，然后通過按鈕賦值，再在氣泡框的確認方法中將數據取來用。

 

結果：

<el-popconfirm @onConfirm="deleteCollection"
                title="刪除后不可恢復，確認刪除？"
              >
                <el-button class="collection_delete" slot="reference" type="danger"
                           @click="getCollectGroupId(collection.collectGroupId)">刪除</el-button>
              </el-popconfirm>

// 刪除收藏夾列表
    deleteCollection(e) {
      alert(this.collectGroupId)
    },
    // 獲取要刪除的收藏夾id賦值geicollectGroupId，方便后續的調用
    getCollectGroupId(e) {
　　//vue的data下創建一個collectGroupId
      this.collectGroupId = e;
    },

 

說起來挺尷尬的，這段代碼寫完之后，隔了一天，我突然想起來為什么要隔一個方法傳值過去，直接在deleteCollection方法里面傳值過去不久行了？我還非得多做一步？我昨天又煞筆了。淚流滿面，人傻沒救了。放這了，我也不刪這篇博客了，有點點想哭。