<template>
  <div class="container bg-white mx-auto mt-3  p-0 text-blue-700 leading-loose">
      <div v-if="isLoading">
          <h2>Loading ...</h2>
      </div>
      <div v-else>
          <div  v-for="(item, index) in page" >
              <a :href="'/notice/'+item.slug"> <h3> {{item.title}}</h3> </a>
         
              
          </div>
          <!-- <div v-html="page[0].content" class="container mx-auto">
  
          </div> -->
      </div>
  </div>
  </template>
  
  <script>
  export default {
      data() {
          return {
              page: null,
              isLoading: true
          }
      },
      mounted: function () {
          fetch('https://api8.siliconpin.com/items/scc22?filter[type][_eq]=notice&limit=-1')
          // fetch('https://api8.siliconpin.com/items/scc22?slug=about-us')
              .then(response => response.json())
              .then(data => {
            this.page = data.data
          //   console.log(data)
            this.isLoading = false
          })
      }
  }
  </script>