vue中动态绑定类样式，有类但是样式没有

Question

上代码片段

<template>
  <div class="edit-song-tags">  
    <div class="body">           
      <div class="table-box theme">
        <table>
          <tbody>
            <tr>
              <td class="key" rowspan="2">
                <p>
                </p>
                <p class="text">主题</p>
              </td>
              <td @click="isCheck" :calss="songTags.includes('综艺')?'tags-active':''">综艺</td>
              <td @click="isCheck" :calss="songTags.includes('影视原声')?'tags-active':''">影视原声</td>
              <td @click="isCheck" :calss="songTags.includes('ACG')?'tags-active':''">ACG</td>
            </tr>
            <tr>
              <td @click="isCheck" :calss="songTags.includes('儿童')?'tags-active':''">儿童</td>
              <td @click="isCheck" :class="songTags.includes('校园')? 'tags-active':''">校园</td>
              <td @click="isCheck" :calss="songTags.includes('游戏')?'tags-active':''">游戏</td>
            </tr>
            <tr>
              <td @click="isCheck" :calss="songTags.includes('70后')?'tags-active':''">70后</td>
              <td @click="isCheck" :calss="songTags.includes('80后')?'tags-active':''">80后</td>
              <td @click="isCheck" :calss="songTags.includes('90后')?'tags-active':''">90后</td>
              <td @click="isCheck" :calss="songTags.includes('网络歌曲')?'tags-active':''">网络歌曲</td>
            </tr>
            <tr>
              <td @click="isCheck" :calss="songTags.includes('KTV')?'tags-active':''">KTV</td>
              <td @click="isCheck" :calss="songTags.includes('经典')?'tags-active':''">经典</td>
              <td @click="isCheck" :calss="songTags.includes('翻唱')?'tags-active':''">翻唱</td>
              <td @click="isCheck" :calss="songTags.includes('吉他')?'tags-active':''">吉他</td>
            </tr>
            <tr>
              <td @click="isCheck" :calss="songTags.includes('钢琴')?'tags-active':''">钢琴</td>
              <td @click="isCheck" :calss="songTags.includes('器乐')?'tags-active':''">器乐</td>
              <td @click="isCheck" :calss="songTags.includes('榜单')?'tags-active':''">榜单</td>
              <td @click="isCheck" :calss="songTags.includes('00后')?'tags-active':''">00后</td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</template>

<script lang='ts'>
import { Component, Vue } from "vue-property-decorator";
@Component
export default class EditSongName extends Vue {
  private songTags = "校园-影视原声-吉他";
  get id() {
    return parseInt(<string>this.$route.query.songid);
  }
  
  isCheck(e: any) {
    e.target.classList.add("tags-active");
  }
}
</script>
<style scoped lang='less'>
.tags-active {
  background-color: @klColor;
  color: white;
}
</style>

为什么类存在。而样式却没有呢？
当然如果不是不是table的话，又有样式

Answer 1

是class 不是 calss