带有Vue.js的jQuery-$（this）在方法中不起作用

Question

首先，我知道将jQuery与Vue混合并不是一个好主意。但是，尽管如此，我还是试图在单击后对元素进行操作，但是$(this)不起作用。

methods: {
  openSMS() {
    $(this).hide(); // <-- not working here..
    // More code...
  },
  addEventListeners() {
    $(document).ready(function() {
      $(".ml-inbox-msg-item").click(function() {
        // $(this).hide() <-- it works here
        InboxSidebar.openSMS();
      });
    });
  }
}

页面上有许多.ml-inbox-msg-item元素。

如果我将$(this).hide()放在.click函数中，那么它将起作用。有没有办法将其传递给openSMS()函数？

Answer 1

这是因为openSMS()的范围与click处理函数不同。假设您可以更改方法签名，请修改openSMS()以接受元素引用作为参数：

methods: {
  openSMS(el) {
    $(el).hide();
  },
  addEventListeners() {
    $(document).ready(function() {
      $(".ml-inbox-msg-item").click(function() {
        InboxSidebar.openSMS(this);
      });
    });
  }
}