<template>
    <view class="userinfo">
        <view class="userhead">
            <image :src="list.member_avatar"></image>
            <text>+</text>
        </view>
        <view class="zan">
            <image></image>
            <text>{{list.like_num}}</text>
        </view>
        <view class="shoucang">
            <image></image>
            <text>{{list.collect_num}}</text>
        </view>
        <view class="pinglun">
            <image></image>
            <text>{{list.comment_num}}</text>
        </view>
        <view class="gouwu">
            <image></image>
        </view>
    </view>
</template>
<style lang="scss" scoped>
image{
    background-color: #0f0;
}
.userinfo{
    width: 110rpx;
    height: 570rpx;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    >view{
        display: flex;
        flex-direction: column;
        align-items: center;
        font-size: 28rpx;
        color: #fff;
        >text{
            margin-top: 17rpx;
        }
        >image{
            width: 50rpx;
            height: 50rpx;
        }
    }
    >view:first-child{
        display: flex;
        position: relative;
        align-items: center;
        >image{
            width: 110rpx;
            height: 110rpx;
            border-radius: 50%;
            border: 2rpx solid #fff;

        }
        >text{
            width: 36rpx;
            height: 36rpx;
            font-size: 36rpx;
            background-color: #FF780F;
            position: absolute;
            top: 75rpx;
            border-radius: 50%;
            line-height: 36rpx;
            text-align: center;
        }
    }
}
</style>
<script>
export default {
    name:'userinfo',
    data(){
        return {

        }
    },
    props:['list']
}
</script>