v-for 遍历后单个点击事件

利用v-for 循环遍历出来的数据，通常会配合点击事件去完成一些样式的渲染，仅仅作为个人记录

<template>
    <div>
        <div :style="imgSelect.style" v-for="item in imgSelect.list" class="img-wrap">
            <img @click="imgClick(item)" :data-id="item.id" :src="item.src" alt="" />
            <i
                v-show="item.index == '-1' ? true : false"
                style="position: absolute;top: 0;right: 0;color: #409EFF;">
            </i>
        </div>
    </div>
</template>

<script>
export default {
    name: "imgSelect",
    props: {
        imgSelect: {
            type: Object
        }
    },
    data() {
        return {};
    },
    mounted() {
        console.log(this.imgSelect);
    },
    methods: {
        imgClick(item) {
            if (item.index == undefined) {
                //动态的将当前数据添加一条数据以便控制 i 标签的显示和隐藏
                this.$set(item, "index", "-1");
            } else {
                this.$delete(item, "index", "-1");
            }
        }
    }
};
</script>