uniAPP中li悬停的时候怎么获得它的下标
在uniapp中,可以通过以下步骤获取li的下标:
-
在li标签中添加一个唯一的标识符,比如id或者data-id,并将其值设置为当前li的下标。
-
在li的hover事件中,通过e.target获取当前的li元素。
-
通过li元素的标识符获取其下标值。
示例代码如下:
<template>
<ul>
<li v-for="(item, index) in list" :key="index" :id="'li-' + index" @mouseover="handleHover">{{ item }}</li>
</ul>
</template>
<script>
export default {
data() {
return {
list: ['apple', 'banana', 'orange']
}
},
methods: {
handleHover(e) {
const li = e.target;
const index = li.id.split('-')[1];
console.log('当前li的下标是:', index);
}
}
}
</script>
原文地址: https://www.cveoy.top/t/topic/uQf 著作权归作者所有。请勿转载和采集!