<template>
  <!-- 数字资源 -->
  <div class="content-main">
    <!-- <div class="common-title">新书推荐</div> -->
    <div ref="newbook" class="big-module module-content">
      <div v-for="(item,index) in rankingList" :key="index" class="main-item">
        <img :src="item.bgImg">
        <div class="title">
          {{ item.title }}
        </div>
      </div>
      <!-- <div v-for="(item,index) in rankingList" :key="index" class="book-list-item">
        <img class="book-img" :src="item.img">
        <div class="book-info">
          <h4 class="title-item">{{ item.title }}</h4>
          <p>{{ item.author }}</p>
        </div>
        <div class="ranking-num">
          <svg v-if="item.ranking === 1" class="icon" aria-hidden="true">
            <use xlink:href="#icon-a-no1" />
          </svg>
          <svg v-if="item.ranking === 2" class="icon" aria-hidden="true">
            <use xlink:href="#icon-a-no21" />
          </svg>
          <svg v-if="item.ranking === 3" class="icon" aria-hidden="true">
            <use xlink:href="#icon-a-no3" />
          </svg>
          <p>NO.{{ item.ranking }}</p>
        </div>
      </div> -->
    </div>
  </div>
</template>

<script>
import data from './digitalResourceJson'

export default {
  name: 'DigitalResource',
  data() {
    return {
      rankingList: []
    }
  },
  created() {
    this.rankingList = data.srcList
  },
  mounted() {
  },
  destroyed() {
  },
  methods: {
  }
}
</script>

  <style lang="scss">
  @import "~@/assets/styles/index.scss";
  </style>
