sortable class

[SergeyMiracle]

As i see there is no way to mark column as sortable with icon when column is sortable but not active, i hope u understand... So i see isInCurrentSortGroup method, maybe you could place in this part :class="['vuetable-th-component-'+trackBy, field.titleClass, {'sortable': isSortable(field)}]" class active or whatever?

<th v-if="extractName(field.name) == '__component'"
                  @click="orderBy(field, $event)"
                  :class="['vuetable-th-component-'+trackBy, field.titleClass, {'sortable': isSortable(field)}]">
                  {{ field.title || '' }}
                  <i v-if="isInCurrentSortGroup(field) && field.title"
                     :class="sortIcon(field)"
                     :style="{opacity: sortIconOpacity(field)}"></i>
              </th>

[ratiw]

@SergeyMiracle I'm not sure if I understand you correctly, but it seems like you would like to show the user which column is sortable and which is not. Am I right?

If so, you can use CSS to target the sortable field with different color like so

  th.sortable {
    color: orange;
  }

The sortable column title will be displayed as orange and the unsortable one will not be orange.

[SergeyMiracle]

@ratiw Yeah, but i wanna show an icon and hide it, when column is sorted, like in datatables for example

[ratiw]

@SergeyMiracle That is actually a matter of preference. I actually like the way it is right now than how Datatables looks. But feel free to folk the project and tinker it the way you like. :)

[jwkicklighter]

I would also like the functionality of a class being added to the sorted columns, rather than just an icon element being added inside the th. Would provide some flexibility for styling beyond just adding/removing an arrow icon. I don't see any reason that a simple class binding couldn't be applied to the th elements in addition to having the icons added.