Vuetify.js 1.5 버전 data table에 관한 몇 가지

 

일단 공식 문서.

https://v15.vuetifyjs.com/en/components/data-tables/

1. slot을 쓰지 않으면 안보인다.

그런 주제에 공식 문서에 있는대로 쓰면 안보인다. 아래처럼 써야 한다.

자동으로 header의 value값을 키로 사용하지 않을 거면 header는 왜 쓰라고 하는건가...

<v-data-table :headers="headers" :items="items">
  <template slot="items" slot-scope="props">
    <td>{{props.item.title}}</td>
    <td>{{props.item.description}}</td>
  </template>
</v-data-table>

2. pagination을 안 하는 방법

버전 2에 있는 disable-pagination 옵션이 없다.

한 페이지에 몇 개씩 보여줄 것인지 설정하는 목록에 -1(전체)만 주면 된다.

<v-data-table :headers="headers" :items="items" :rows-per-page-items="[-1]">
    ...
</v-data-table>

#vue #vuejs #vuetifyjs #버전차이 #javascript #라이브러리 #migration #datatable #테이블 #html #개발 #코딩 #1일1개발