<template>
  <div class="board-basic-list">
    <table>
      <thead><tr><th>번호</th><th>제목</th><th>작성자</th><th>날짜</th><th>조회</th></tr></thead>
      <tbody>
        <tr v-for="p in posts" :key="p.id">
          <td>{{ p.no }}</td><td><a :href="`./${p.id}`">{{ p.title }}</a></td>
          <td>{{ p.author }}</td><td>{{ p.date }}</td><td>{{ p.views }}</td>
        </tr>
      </tbody>
    </table>
  </div>
</template>
<script setup>defineProps({ posts: { type:Array, default: ()=>[] } });</script>
<style scoped>
.board-basic-list table { width:100%; border-collapse:collapse; font-size:14px; }
th, td { padding:11px 12px; border-bottom:1px solid #eee; text-align:left; }
th { background:#f8fafc; font-weight:700; color:#0f5fa8; }
td a { color:#333; text-decoration:none; } td a:hover { color:#0f5fa8; }
</style>
