效果

页面样式

点击首行控制台输出信息

代码

:data-id="item.id"：定义id信息，在点击事件时e.currentTarget.dataset.id获取点击行的id

:data-index="index"：定义index信息，在点击事件时e.currentTarget.dataset.index获取点击行的索引

:data-item="item"：定义item信息，在点击事件时e.currentTarget.dataset.item获取点击行的整行信息

<template><view><view class="item_all" v-for="(item, index) in allinfo" :key="index"><view class='position' :data-id="item.id" :data-index="index" :data-item="item" @tap="deatil"><view class="vv_1">id: {{item.id}}</view><view class="vv_1">name: {{item.name}}</view><view class="vv_1">age: {{item.age}}</view></view></view></view>
</template><script>export default {data() {return {allinfo: [{id: 1,name: '张三',age: '12'},{id: 2,name: '李四',age: '21'},{id: 3,name: '王五',age: '44'},]};},methods: {deatil(e) {console.log("id:"+e.currentTarget.dataset.id)//获取行id信息console.log("index:"+e.currentTarget.dataset.index)//获取索引index信息console.log(e.currentTarget.dataset.item)//获取整行信息}}};
</script>
<style>.item_all {margin-bottom: 3%;}.position {padding: 6% 0;width: 100%;background-color: #fff;box-shadow: 4rpx 4rpx 4rpx gainsboro;}.vv_1 {margin: 0 5%;word-break: break-all;}
</style>