vue中通过点击事件修改css样式，两个按钮样式切换

通过ref修改

<div class="sub" ref="abc" @click="submit()">确定</div>

  submit() {
      if (!this.password) {//我写的判断
        this.$refs.abc.style.background = "#ccc";
      } else {
        this.$refs.abc.style.background = "#07C160";
      }
    },

有的时候通过值来判断修改

      <span
        :class="this.state==1?'active ':'active1'"
        @click="deviceEnableOrDisable(0)"
        ref="abc"
      >正常</span>
      <span
        :class="this.state==0?'active ':' active1'"
        style="margin-left:10px;"
        @click="deviceEnableOrDisable(1)"
        ref="abc1"
      >停用</span>

默认state有值的情况下，有基础样式。其次在点击修改（相当于按钮样式切换的笨方法）
deviceEnableOrDisable(value) {
  if (value == 0) {
    this.$refs.abc.style.background = "#52c41a";
    this.$refs.abc.style.color = "#fff";
    this.$refs.abc1.style.background = "transparent";
    this.$refs.abc1.style.color = "#1890ff";
  } else if (value == 1) {
    this.$refs.abc1.style.background = "#52c41a";
    this.$refs.abc1.style.color = "#fff";
    this.$refs.abc.style.background = "transparent";
    this.$refs.abc.style.color = "#1890ff";
  }
},