yihuo/pages/product/detail.vue

<template>
    <view class="wrapper">
        <view class="font4 bold color-1 paddingX14 paddingB14">商品详情</view>

        <image style="width: 100%; height: 2276rpx" :src="ossurl.home.bottomIntro" />
        <image-fit v-for="(item, index) in pics" :key="index" :src="item"/>
    </view>
</template>
<script>
import imageFit from '@/components/image-fit'
import ossurl from '@/utils/ossurl'

export default {
    components: { imageFit },
    props: {
        data: Object
    },
    data() {
        return {
          ossurl,
            pics: []
        }
    },
    mounted() {
        this.pics = this.data.pic.split(',')
    }
}
</script>
<style lang="scss" scoped>
.wrapper {
    margin-top: 20rpx;
    background: #fff;
    border-radius: 20rpx;
    padding: 36rpx 0;
    .image {
        // padding: 26rpx;
        width: 100%;
        height: 540rpx;
    }

    .topIntro {
    width: 100%;
    height: 580rpx;
    position: relative;
    .code {
        width: 260rpx;
        height: 336rpx;
        position: absolute;
        top: 117rpx;
        right: 32rpx;
        .img {
            width: 260rpx;
            height: 260rpx;
        }
    }
}
}
</style>
</style>