vuetifyjs : How to create multi-lines header in v-data-table?

问题

I need multi-lines header in this scenario:
the fist line is level 1 header, the second line is level 2, like this pic:

multi-lines header

Thanks!

回答1:

By adding a child to the header you could implement multi-line header in v-data table.

 headers: [
   {
     text: 'Film Title',
     align: 'center',
     sortable: false,
     value: 'film',
   },
   { text: 2018, value: 'dec', sortable: false, align: 'center',child:["December"] },
   { text: 2019, value: 'jan',  sortable: false, align: 'center',child:["January","February"]  }
 ],

you could visit this link for the sample output: https://codepen.io/nicemid/pen/ZwXmeq

来源：https://stackoverflow.com/questions/53027979/vuetifyjs-how-to-create-multi-lines-header-in-v-data-table