如何在@click事件中获取组件实例?

时间:2017-08-20 03:43:47

标签: vue.js components vuejs2 vue-component

我在Vue组件中有一个按钮

<el-button class='range-right' @click='deleteItem(item)'>delete</el-button>

在它的处理程序中我想调用组件的其他方法。 但是,即使我可以调用deleteItem本身就是一个组件方法,我也无法获得其他方法的实际组件。

有没有办法将类似$component param的内容传递给@click事件?

methods {
  deleteItem: (item, obj) => {
    let api = '/api/train/deleteItem?_id=' + item._id
    let resource = Vue.resource(api)
    let vm = this  // NOT a component
    window.delItem = this
    console.log('deleteItem.this', this)
    resource.delete(api)
    .then(items => {
      console.log('deleted')
      vm.methods.load() //<< fails
    })
  },

1 个答案:

答案 0 :(得分:0)

我认为问题是注释的箭头功能

使用md查看此处的示例:

https://jsfiddle.net/rvp6fvwp/

箭头函数绑定到父上下文,如此处https://vuejs.org/v2/guide/instance.html#Properties-and-Methods

所述
  

不要在实例属性或回调上使用箭头函数(例如   function。正如箭头功能一样   绑定到父上下文,这将不是Vue实例   你期望和this.myMethod将是未定义的。