pointsMall/src/components/list-scroll.vue

<template>
  <vue-seamless-scroll :data="listData" class="warp">
    <ul class="item">
      <li v-for="(item, index) in listData" :key="index">
        <span class="name">{{ item.userName }}</span>
        <span class="title">{{ item.fullName }}</span>
        <span class="date">{{ item.createTimeStr }}</span>
      </li>
    </ul>
  </vue-seamless-scroll>
</template>

<script>
import vueSeamlessScroll from 'vue-seamless-scroll'
import { winningList } from "@/api/allApi";
export default {
  name: 'Example01Basic',
  components: {
    vueSeamlessScroll
  },
  props:['listData'],
  data() {
    return {
      
    }
  },
  created() {
    
  },
  methods: {
   

  },
}
</script>

<style lang="scss" scoped>
.warp {
  height: 200px;
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  z-index: 10;
  background: url(@/assets/image/zjmd.jpg) no-repeat;
  background-size: 100% 100%;
  width: 260px;
  height: 200px;

  ul {
    list-style: none;
    padding: 0;
    margin: 0 auto;

    li {
      color: #fff;
      display: block;
      height: 50px;
      display: flex;
      align-items: center;
      font-size: 12px;
      font-weight: bold;
      border-bottom: 1px solid #fff;

      .name {
        width: 15%;
        text-align: center;
      }

      .title {
        text-align: center;
        width: 55%;
        word-wrap: break-word;
        word-break: break-all;
        // overflow: hidden;/*这个参数根据需求来决定要不要*/

      }

      .data {
        text-align: center;
        width: 30%;
      }
    }
  }
}
</style>