简单获取数组中指定元素的索引，和它前面后面所有元素的索引

Question

数据：data:{    arr:[{name:"apple",price:10},{name:"banana",price:9},{name:"pare",price:9}]}通过简单渲染 ：<ul v-for="item in data.arr">  <li>{{item.name}}</li></ul>大概意思就这样...给每个li添加了点击事件，通过点击某个li，让它自己和它前面li 都设置成灰色的背景色，它后面的就背景色不变，jquery 的话可以用prevAlL()获取当前的元素的前面所有元素，在vue中，要怎么操比较好，能获取到当前元素的前面所有元素和它后面的元素？