jQuery中on方法绑定事件如何有效的获取当前点击元素的index下标

Question

<ul class="accountlist">

  <li v-for="(item,index) in bankcardData" :key="index" @click="curindex === index" :class="curindex === index ? 'active' : ''">
    <i class="icon-corner corner" v-if="curindex === index"></i>
    <span class="textcenter">{{item.bankName}}</span>
    <p class="card-number textleft">{{item.accountNo}}</p>
    <div class="anchor">
      <button class="textleft btn default-btn" @click="activestyle($event,index)" :class="curindex === index?'opacity':''">设置默认</button>
      <button class="textright cancel-btn" v-popover:popover>解除绑定</button>
    </div>
  </li>
</ul>

setDefault(){
  var self = this;
  $('.accountlist').on('click', '.default-btn', function() {
    var curli = $(this).parents('li');
    $('.accountlist').prepend(curli);

    var curliIndex = curli.index();
    console.log(curliIndex); //curliIndex 当前下标 点击任何一个li都为 0下标

    post(self,api.setDefault,self.setDefaultList,(response)=>{
      self.getEntBank();
    })
  });
},

Answer 1

<li v-for="(item,index) in bankcardData" :key="index" @click="liClick(index)" :class="curindex === index ? 'active' : ''">

赶脚你还一直再用jq的思想在编程，

liClick(index){
this.curindex === index;
console.log(index)//获取li 的 index即下标
}

Answer 2

你这个jquery和vue结合的.....
你可以将方法直接写在vue的methods中，直接就打印出index了，多读读api，套模板也不会出这种错啊....