时间戳

首页 > 解决方案 > Bootstrap 4 modal onclick 处理程序在 VueJS 2 组件中不起作用

twitter-bootstrap - Bootstrap 4 modal onclick 处理程序在 VueJS 2 组件中不起作用

问题描述

我在 vuejs 中使用 Bootrap 4 模态，称为：

> <a   href="#" class="" data-toggle="modal" :data-email="user.email" 
> data-target="#exampleModal">Delete</a>

我为模态中的按钮动态创建 onclick 处理程序，例如：

mounted() {

    $('#exampleModal').on('show.bs.modal', function (event) {
      var button = $(event.relatedTarget) // Button that triggered the modal
      var email = button.data('email')
      var modal = $(this)
      modal.find('.modal-footer #delete').attr('onclick', "deleteUser('"+ email +"')")
    })

deleteUser 在方法部分定义：

methods:
 deleteUser(email) {
  .....
}

在模态对话框中单击“是”按钮后，我会立即抛出此错误：

Uncaught ReferenceError: deleteUser is not defined
    at HTMLButtonElement.onclick (users:1)
onclick @ users:1

如何解决这个问题呢？我尝试了 let $this = this 并使用了 $this.deleteUser 但这也不起作用。

如何this在回调中访问正确的答案？与 vuejs 和 bootstrap 4 modal 无关。

标签： twitter-bootstrapvue.js

解决方案

推荐阅读