细聊Vue列表中的那些事——自定义属性传参

1.渲染列表模板

<template>
<div v-for="(item,index) in list" :key="index" @click="showName" :data-getname="item.name">
            <span>{{item.name}}</span>
        </div>
</template>

2.注入模拟数据

   data() {
            return {
                list: [{
                        name: '小明'
                    },
                    {
                        name: '小王'
                    },
                    {
                        name: '小苏'
                    }]
   }
   }

3.声明列表事件

methods: {
            showName:function(e){
                console.log(e.currentTarget.dataset.getname)
            }
}

4.查看效果

效果.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。