<template> <div class="product-list"> <RecommendProductItem class="item" v-for="(i, index) in list" v-bind="i" :key="index" @click.native="onClick(i.href)"></RecommendProductItem> </div> </template> <script> import RecommendProductItem from './recommend-product-item'; export default { name: 'RecommendProductList', props: ['list'], components: { RecommendProductItem }, methods: { onClick(url) { console.log(url); this.$yoho.goNewPage({url}); } } }; </script> <style lang="scss" scoped> .product-list { width: 100%; overflow: scroll; white-space: nowrap; } .item + .item { margin-left: 22px; } .item:first-child { margin-left: 40px; } .item:last-child { margin-right: 40px; } </style>