<template>
    <div class="ht-base-multiseriate-demo">
        <ht-base-list>
            <ht-base-row  :gutter="16">
                <ht-base-col v-for="item of data" :key="item.title" span="6">
                    <ht-base-list-item>
                        <ht-base-card :title="item.title" class="demo-list-card">卡片内容</ht-base-card>
                    </ht-base-list-item>
                </ht-base-col>
            </ht-base-row>
        </ht-base-list>
    </div>
</template>

<script>
    const data = [
        {
            title: '第一列标题',
        },
        {
            title: '第二列标题',
        },
        {
            title: '第三列标题',
        },
        {
            title: '第四列标题',
        },
    ]
  export default {
      name: 'HtBaseMultiseriateDemo',
      data () {
          return {
              data,
          }
      },
  }
</script>
<style lang="less">
    .ht-base-multiseriate-demo {
        .demo-list-card{
            width: 100%;
        }
    }
</style>
