jquery 事件代理绑定列表事件，回调函数如何获取每项的原始数据

Question

jquery中用事件代理绑定列表项点击事件，如果要拿到点击项的原始数据，现在的解决方案是在按钮按钮就绑定一个自定义数据列表项的index，然后点击事件中拿到index值再去列表原始数据中去取值。

// 数据绑定
var result = res.data // 后台获取的数据源
// result 为数据源
// 数据通过用artTemplate渲染然后绑定到页面上
$('#list_wrap').append(template('tpl_list_item', {
    data: result
})
// 事件绑定
$('#list_wrap').on('click', '.edit-btn', function(){
    var $this = $(this)
    var idx = $this.attr('data-idx')
    // 这样可以获取到点击项的原始数据
    var item = result[idx]
})

但是在vue项目中，通过vue的click绑定，它可以实现直接传列表项到点击函数中，点击函数可以直接获取到点击项的原始数据，这个vue它是如何实现的，jquery如果要获取列表点击项的原始数据是否有更好的方法

html代码

<!-- 用了element-ui不过没影响 -->
<el-table :data="tableData" element-loading-text="拼命加载中" style="width: 100%">
  <el-table-column prop="MoName" label="菜单名称"></el-table-column>
  <el-table-column prop="MoSort" label="菜单排序"></el-table-column>
  <el-table-column label="操作">
    <template scope="scope">
      <el-button size="small" @click="showUpdatePop(scope.$index, scope.row)">查看详情</el-button>
      <el-button size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
    </template>
  </el-table-column>
</el-table>

调用函数

// 显示修改弹出层
showUpdatePop(idx, item) {
  this.page.popShow = true
  this.$nextTick(function () {
    this.$refs.popForm.setValue(item)
  })
}

想知道vue它事件绑定具体是如何运作的，绑定列表项的时候如何实现回调函数获取点击项的原始数据？