vueでel-checkboxを2回クリックして切り替えるか、クリックしても切り替えない

質問:
vueでel-checkboxを2回クリックして切り替えるか、クリックしても切り替えません.
質問コード:

 <el-checkbox v-model="showFrozenAccount" @change="changeShowAccountStatus">xxxxxx</el-checkbox>

  changeShowAccountStatus() {
      this.showFrozenAccount = !this.showFrozenAccount;
      // .............  
    },

ソリューション:
1つ目の方法:

 <el-checkbox :value="showFrozenAccount" @change="changeShowAccountStatus">xxxxxx</el-checkbox>

  changeShowAccountStatus() {
      this.showFrozenAccount = !this.showFrozenAccount;
      // .............  
    },

2つ目の方法:

 <el-checkbox v-model="showFrozenAccount" @change="changeShowAccountStatus">xxxxxx</el-checkbox>

  changeShowAccountStatus() {
      // .............  
    },

言いたいことがある
elementUIのcheckboxのソースコードを調べてみました.

  <input
        v-else
        class="el-checkbox__original"
        type="checkbox"
        :aria-hidden="indeterminate ? 'true' : 'false'"
        :disabled="isDisabled"
        :value="label"
        :name="name"
        v-model="model"
        @change="handleChange"
        @focus="focus = true"
        @blur="focus = false">
===============================================================
      handleChange(ev) {
        if (this.isLimitExceeded) return;
        let value;
        if (ev.target.checked) {
          value = this.trueLabel === undefined ? true : this.trueLabel;
        } else {
          value = this.falseLabel === undefined ? false : this.falseLabel;
        }
        this.$emit('change', value, ev);
        this.$nextTick(() => {
          if (this.isGroup) {
            this.dispatch('ElCheckboxGroup', 'change', [this._checkboxGroup.value]);
          }
        });
      }
    },

考えたように、el-checkboxにはの中にv-model文法糖が入っていて、ここでv-modelの原理はもう贅沢ではありません.だからの@inputはcheckboxのtrueまたはfalseを変更してくれました.handleChangeでは、私たちが書いたchangeShowAccountStatusをトリガーし、変更後のcheckboxの値を得ることができるので、changeShowAccountStatusでshowFrozenAccountの値を変更するのは多くのことです.これも2つ目の方法の考え方です.
第1の方法の構想はel-checkboxのソースコードを引き続き見る必要がある.モデルの実装を見てみましょう

  computed: {
      model: {
        get() {
          return this.isGroup
            ? this.store : this.value !== undefined
              ? this.value : this.selfModel;
        },
        set(val) {
          if (this.isGroup) {
            this.isLimitExceeded = false;
            (this._checkboxGroup.min !== undefined &&
              val.length < this._checkboxGroup.min &&
              (this.isLimitExceeded = true));
            (this._checkboxGroup.max !== undefined &&
              val.length > this._checkboxGroup.max &&
              (this.isLimitExceeded = true));
            this.isLimitExceeded === false &&
            this.dispatch('ElCheckboxGroup', 'input', [val]);
          } else {
            this.$emit('input', val);//  ！！！！
            this.selfModel = val;
          }
        }
      },

el-checkboxの公式ドキュメントもご覧ください
パラメータ
説明
value/v-model
バインド値
vモデルでvalueを使う必要はありません