<template>
  <view class="div guess-like" v-if="goodsList && goodsList.length">
    <view class="div title">猜你喜欢</view>
    <view class="div product-list-body">

      <index-product-body
              class="product-item"
              :item="item"
              :index="index"
              v-for="(item, index) in goodsList"
              v-bind:key="index"
      ></index-product-body>
    </view>
  </view>
</template>

<script>
import { mapState } from 'vuex'
import IndexProductBody from './home/index/IndexProductBody'
import { getGuessLike } from '../api/homeindex'
export default {
  name: 'GuessLike',
  data () {
    return {
      goodsList: false
    }
  },
  computed: {
    ...mapState({
      user: state => state.member.info
    })
  },
  components: {
    IndexProductBody
  },
  props: {

  },
  created: function () {
    if (this.user) {
      getGuessLike(this.user.member_id).then(res => {
        this.goodsList = res.result.goods_list
      })
    }
  },
  methods: {

  }
}
</script>
<style scoped lang="scss">
  .guess-like{background: #fff}
  .product-list-body{
    display: flex; flex-wrap: wrap;background: #fff;padding-right: $pageSpace;
    .product-item{width:50%;}
    }
  .title{text-align: center;position:relative;font-size:$mainFontSize;color:#000;font-weight:700;padding-top:.5rem;padding-bottom:1rem;}
</style>
