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的知识，而不是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

当您按OK时，Bootstrap Vue模态会触发@ok事件。您可以像这样使用它：

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

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

在Vue App中处理模态窗口的结果

1 个答案: