<template>
    <div class = "noticeList">
        <ul>
            <li v-for = "notice in noticeList" :key="notice.date">
              {{notice.title}}
              <br>
              {{notice.date}}
            </li>
        </ul>
    </div>
</template>

<script>
import axios from 'axios'

export default {
  el: '.noticeList',
  name: 'noticeList',
  data () {
    return {
      noticeList: []
    }
  },
  components: {
  },
  created () {
    this.fetchNoticeList()
  },
  methods: {
    fetchNoticeList () {
      axios
        .post('/api/fetchNoticeList', {})
        .then((noticeList) => {
          console.log(noticeList.data)
          this.noticeList = noticeList.data
        })
    }
  }
}
</script>

<style>
    .imfoList{
        width: 800px;
        background: grey;
    }
    ul{
        display: flex;
        flex-direction: column;
        margin: 0 auto 10px auto;
    }
    li{
        margin-bottom:10px;
    }
</style>