vue使用v-for循环时怎样只获取到当前鼠标经过的元素去处理？

Question

我这样写，然后鼠标进过所有的li标签都改变了                <ul class="clearfix">          <li class="pull-left"              v-for="(item,index) in homeTag"              v-bind:key="index"              @click="goNextPage(item.path)"              ref="hover"              @mouseenter="enter"              @mouseleave="leave">            <div class="tag-title">{{item.title}}</div>            <ul>              <li>{{item.introduce1}}</li>              <li>{{item.introduce2}}</li>              <li>{{item.introduce3}}</li>            </ul>            <a href="javascript:;" >去了解</a>          </li>          <li class="pull-left">            <a href="javascript:;">更多产品</a>          </li>        </ul>methods :                 enter () {            Velocity(this.$refs.hover, {width: 350}, {duration: 500})          },          leave () {            Velocity(this.$refs.hover, {width: 275}, {duration: 500})          }

Answer 1

根据v-for的 index 去判断当前是哪条

Answer 2

你所有的li的ref都是相同的啊
原生事件都有一个默认的 $event参数，而通过$event.target可以拿到触发事件的元素

Answer 3

ref="hover"，this.$refs.hover你所有的ref都一样，尝试区分一下应该就好了