javascript - vue app中处理模态窗口的结果

Question

我正在尝试在我的项目中使用“Bootstrap + Vue”中的模式。

现在这可能是一个基本问题，但经过一段时间的搜索后我没有找到任何答案，所以我会继续问。

考虑以下模式

<b-modal ref="myModalRef"  @ok="handleOk">
    Are You Sure You Want To Delete?
</b-modal>  

所以，如果我想处理ok按钮，那就很简单了

export default {
  methods: {
   handleOk: function() {
      alert('alert form table - ok is pressed!!')
    }
  }
} 

但是，在我的情况下，我有以下情况，我想知道在我的 deleteRow 函数中按下了什么，该函数具有 person 的知识，而不是 handleOk与人无关:

deleteRow: function(person){
   //show dialog 
   this.$refs.myModalRef.show()
   // it would be nice to know here what was pressed
    if (okpressed) 
       actuallyDetele(person)
}

换句话说，我正在寻找像 confirm 这样的功能，但我想使用模态。

var r = confirm("Are You Sure You Want To Delete?");
if (r == true) {
    // continue 
} else {
   //do nothing 
}

有什么建议我如何用模态来实现这一点。

谢谢。

Answer 1

当您按“确定”时，Bootstrap Vue 模式会触发 @ok 事件。您可以像这样使用它:

<b-modal id="deleteModal"
             ref="modal"
             title="Are you sure?"
             @ok="deleteYourUser"
             @shown="anotherFunct">

并且始终预先选择用户并将其保存在数据变量中以在内部删除功能中使用。您没有其他方法可以将您稍后确认后想要删除的用户传递给模式。