<template>
  <u-waterfall ref="waterfall" v-model="goodsList">
    <template v-slot:left="{ leftList }">
      <view v-for="(item, index) in leftList" :key="index" class="px-rowSm mb-base">
        <goods-item :goods="item"></goods-item>
      </view>
    </template>
    <template v-slot:right="{ rightList }">
      <view v-for="(item, index) in rightList" :key="index" class="px-rowSm mb-base">
        <goods-item :goods="item"></goods-item>
      </view>
    </template>
  </u-waterfall>
</template>
<script>
export default {
  props: {
    list: {
      type: Array,
      default: () => [],
    },
  },
  data(){
    return {
      goodsList:[]
    }
  },
  watch:{
    list:{
      deep:true,
      immediate:true,
      handler(e){
        this.goodsList = this.$u.deepClone(e);
      }
    }
  },
  methods:{
    clear(){
      this.$refs.waterfall.clear();
    }
  }
};
</script>
