<el-dialog
          class="dataObject"
          :title="$t('add.B') + $t('dataObject.C')"
          :visible.sync="viewing"
          :close-on-click-modal="false"
          width="40.5rem"
          @open="load"
          @closed="handleDialogClosed">
 <span slot="footer" class="dialog-footer">
    <el-button type="primary" @click.native="handleDialogClosed">關閉</el-button>
  </span>
</el-dialog>

問題：
當點擊彈框的關閉事件時 handleDialogClosed會被執行兩遍，但是點擊彈框右上角的 X 時卻只會執行一遍。 兩處操作都只是綁定了同一個操作事件， 為什么一個會執行兩遍一個卻只會執行一遍

原因：
因為彈框下方的button事件 關閉彈框的時候會自動執行 @closed
事件。 所以 關閉按鈕執行了一遍，彈框本身的close事件又執行了一遍， 一共執行了兩邊。
但是彈框右上角的X是彈框本身的 關閉事件故只執行一遍。

解決方案：

將關閉按鈕的事件 和 彈框右上角的X事件 分開綁定的方法即可。