yihuo/pages/award_detail_swipe/detail.vue

<template>
    <view class="wrapper">
        <view class="font6 bold padding14" style="text-align: center;">商品详情</view>
        <div v-for="(item, index) in pics" :key="index">
            <image-fit :src="item" />
        </div>
    </view>
</template>
<script>
import imageFit from '@/components/image-fit'

export default {
    components: { imageFit },
    props: {
        data: Object
    },
    watch: {
        data (newValue) {
            if (newValue.pic) {
                this.pics = newValue.pic.split(',')
            } else {
                this.pics = []
            }
        }
    },
    data () {
        return {
            pics: []
        }
    },
    mounted () {
        if (this.data.pic) {
            this.pics = this.data.pic.split(',')
        }
    }
}
</script>
<style lang="scss" scoped>
.wrapper {
    margin-top: 20rpx;
    border-radius: 20rpx;

    .image {
        width: 100%;
        height: 540rpx;
    }
}

.margin-1 {
    margin-top: -1px
}
</style>