Como você alterna uma classe no vue.js?

Eu tenho o seguinte:

        <th class="initial " v-on="click: myFilter">
            <span class="wkday">M</span>
        </th>


        new Vue({
          el: '#my-container',

          data: {},

          methods: {
            myFilter: function(){

              // some code to filter users
            }
          }
        })

Quando clicoth Eu quero aplicaractive como uma classe da seguinte maneira:

        <th class="initial active" v-on="click: myFilter">
            <span class="wkday">M</span>
        </th>

É necessário alternar, ou seja, cada vez que você clica, precisa adicionar / remover a classe.

Como você faz isso no vue.js?