title: How to add icon to the Header in vuetify DataTable
body: <p>I'm trying to add (+) icon to the one of the header columns in v-datatable.
  The code below does not add any icon. Actually, creating template slot for header does not have any effect on datatable.</p>
  <p>What I try,</p>
  <pre><code>&lt;template&gt;
    &lt;v-data-table 
              item-key=&quot;name&quot;
              :items=&quot;complainantInfos&quot;
              :headers=&quot;headers&quot;
              sort-by=&quot;Id&quot;
              class=&quot;elevation-1&quot;&gt;
              &lt;template v-slot:top&gt;
                  &lt;v-toolbar flat color=&quot;white&quot;&gt;
                  &lt;v-toolbar-title&gt;Inspection&lt;/v-toolbar-title&gt;
                  &lt;v-spacer&gt;&lt;/v-spacer&gt;           
                  &lt;/v-toolbar&gt;
              &lt;/template&gt;
                &lt;template slot=&quot;headers&quot; slot-scope=&quot;props&quot;&gt;
                 &lt;tr&gt;         
                    &lt;th
                       v-for=&quot;header in props.headers&quot;
                       :key=&quot;header.text&quot;&gt;
                       &lt;v-icon small &gt;plus-circle-outline&lt;/v-icon&gt;
                       {{ header.text }}
                    &lt;/th&gt;
                 &lt;/tr&gt;
               &lt;/template&gt;
      &lt;/v-data-table&gt;
  &lt;/template&gt;
  &lt;script&gt;
    import {  mapGetters } from &quot;vuex&quot;;    
  export default {    
      data(){
          return{
             complainantInfos:[
                {
                   ...
                 }
             ],
              headers: [
                  { text: 'NameSurname', value: 'name', align: 'left' ,width: &quot;25%&quot; },
                  { text: 'ID', value: 'PersonelIdNumber' },
                  { text: 'Phone-1', value: 'Cellular1' },
                  { text: 'Phone-2', value: 'Cellular2' },  
                  { text: 'Work Phone',  value: 'WorkPhone' },  
                  { text: 'InterPhone',  value: 'Interphone' },
                  { text: 'Email',   value: 'Email' },
                  //{ text: '+', value: 'action', sortable: false, align: 'right'}
                
              ],   
  </code></pre>
  <p>I have edited the code according to the comments. The problem solved.</p>
  <pre><code> ...
  
      &lt;/v-card&gt;
                  &lt;/v-form&gt;
                &lt;/v-dialog&gt;
              &lt;/v-toolbar&gt;
              &lt;/template&gt;           
              
              &lt;template v-slot:header.Actions=&quot;{ header }&quot;&gt;
                 
                       &lt;v-icon small&gt;plus-circle-outline&lt;/v-icon&gt;{{ header.text }}
               
              &lt;/template&gt;
  ...
  </code></pre>