Javascript v型中的VueJS反转值

这是我的代码：

<input
   v-model="comb.inactive"
   type="checkbox"
   @click="setInactive(comb.id_base_product_combination)"
>

<input
   v-model="comb.inactive"
   type="checkbox"
   @click="setInactive(comb.id_base_product_combination)"
>

我需要在v型上应用comb.inactive的反转

以下是我所尝试的：

<input
    v-model="comb.inactive == 1 ? 0 : 1"
    type="checkbox"
    @click="setInactive(comb.id_base_product_combination)"
>



<input
    v-model="comb.inactive == 1 ? false : true"
    type="checkbox"
    @click="setInactive(comb.id_base_product_combination)"
>

---

你还有其他想法吗？

你应该做以下几点：

为了更好地练习，您可以使用

computed

：

<input
   v-model="checkedItem"
   type="checkbox"
   @click="setInactive(comb.id_base_product_combination)"
>

---

您应该执行以下操作：

为了更好地练习，您可以使用

computed

：

<input
   v-model="checkedItem"
   type="checkbox"
   @click="setInactive(comb.id_base_product_combination)"
>

如果要反转v模型，只需制作一个自定义输入组件

复选框倒置

如果要反转v模型，只需制作一个自定义输入组件

复选框倒置

“您还有其他想法吗？”是的，请使用Vue计算机。这并不保证答案，而是更深入地理解Vue“你有其他想法吗？”是的，使用Vue计算。这并不能保证答案的正确性，而是更深入地理解Vue

computed: {
      checkedItem: {
        get: function () {
          return !this.comb['inactive'];
        },
        set: function (newVal) {
          console.log("set as you want")
        }
}

Vue.component('reverse-checkbox', {
  props: ['value', 'label'],
  template: `
    <label>
      <input
        type="checkbox"
        :checked="valueInverse"
        @input="onInputChanged"
      />
      <span>{{label}}</span>
    </label>
  `,
  computed: {
    valueInverse() {
      return !this.value;
    },
  },
  methods: {
    onInputChanged(e) {
      this.$emit('input', this.valueInverse);
    },
  },
});