vue动态样式通过计算属性绑定的方法

<div
    :class="{ selectResource: getResourceStyle(item.typeId), }"
     @click="getHouseTypeId(item.typeId)"
     class="fayuan"
     v-for="item in houseTypeArr"
     :key="item.typeId"
      >
       {{ item.typeName }}
</div>

<style>
    .selectResource {
      border: 4px solid #ff0000;
    }
</style>


<script>
data() {
    return {

    condition:{
    houseTypeId:""
    }
}

methods:{
/* 点击获取当前点击的标签的值，然后赋值*/
getHouseTypeId(id) {
      this.condition.houseTypeId = id;
      
    },
}
/* 通过计算属性来判断当前值是否等于你点击的这个标签的值，然后显示样式*/
computed: {
    getResourceStyle() {
      return function (id) {
        return this.condition.houseTypeId === id;
      };
    },
}

</script>

最终效果图，选中哪个标签哪个标签显示样式