nuxtProject/components/news/NewsList.vue

<template>
  <li v-if="newsData" @click.prevent="checkInfo(newsData)">
    <div class="newsInfor-img-box" :style="{backgroundImage: `url(${newsData.pic || newsInforImg})`}"></div>
    <div class="newsInfor-list-content">
      <h5>{{ newsData.title }}</h5>
      <div><span class="mta-hidden-sm">{{ changeFullDate(newsData.startTime) }}</span></div>
      <div class="mta-hidden-xs"><i></i><span>{{ changeFullDate(newsData.startTime) }}</span><i type="visits"></i><span>{{ newsData.visits }}</span>
      </div>
      <p>{{ newsData.intro }}</p>
      <!-- <a class="mta-hidden-xs" :href="`${baseUrl}/news/${newsData.code}`" >
             <span>了解更多</span>
        </a>-->

    </div>
  </li>
</template>

<script>
import {mapGetters} from 'vuex';

export default {
  name: 'NewList',
  props: {
    newsData: {
      type: Object,
      default: () => {
      },
    },
  },
  data() {
    return {
      newsInforImg: require(`~/static/images/client/newsInfor/newsInfor-list-img.png`),
    };
  },
  computed: {
    baseUrl() {
      return this.getBaseUrl;
    },
    ...mapGetters(['getBaseUrl']),
  },
  methods: {
    changeFullDate(myDate) {
      const result = new Date(myDate);
      const curYear = result.getFullYear().toString();
      const curMonth = (result.getMonth() + 1).toString().padStart(2, '0');
      const curDay = result.getDate().toString().padStart(2, '0');
      return `${curYear}-${curMonth}-${curDay}`
    },
    checkInfo(data) {
      // console.log(window.localtion.href);
      // console.log(self.localtion.href);
      // console.log(document.URL);
      const opt = {
        id: data.code,
      };
      this.$router.push({name: 'news-id', params: opt});

      this.$emit('know-more', data);
    },
  },
};
</script>

<style scoped>

</style>