hongze_yb_xcx/pages-myChart/components/classifyItem.vue

<template>
    <view class="flex classify-item" :data-id="itemData.dragId" @click.stop="itemClick">
        <view class="name">{{itemData.my_chart_classify_name}}</view>
        <image class="img" src="../static/edit-icon.png" mode="widthFix" v-if="itemData.my_chart_classify_id!==-1" @click.stop="handleClick('edit')"/>
        <image class="img" src="../static/del-icon.png" mode="widthFix" v-if="itemData.my_chart_classify_id!==-1" @click.stop="handleClick('del')"/>
        <image class="img" src="../static/drag-icon.png" mode="widthFix" v-if="itemData.my_chart_classify_id!==-1"/>
    </view>
      
</template>

<script>
export default {
    name:'classifyItem',
    props: {
        itemData:{
            type: Object,
		    value: {}
        },
    },
    methods: {
        itemClick(){
            this.$emit('click')
        },
        handleClick(e){
            this.$emit('click',{optType:e})
        }

    },
}
</script>

<style lang="scss" scoped>
.classify-item{
    padding: 24rpx 0;
    border-bottom: 1px solid #E5E5E5;
    background-color: #fff;
    .name{
        flex: 1;
        padding-left: 10rpx;
    }
    .img{
        width: 40rpx;
        height: 40rpx;
        margin-left: 50rpx;
    }
}
</style>