Vuejs：如何在 V 模型中不是布尔值？

Question

我从 API 中获取 options.customerdata.showbutton 的值作为 true，所以现在开关处于开启状态。

我希望开关处于关闭状态，因此应该给出 v-model="false"。但尝试给予

v-model="!(options.customerdata.showbutton)"

不工作并显示错误。如何实现？

<b-form-checkbox v-model="options.customerdata.showbutton" name="logo-display" switch >
</b-form-checkbox>

Answer 1

模型不能是表达式（必须引用data/property）

最简单的方法是定义数据并将其设置为负值。但请注意，在这种情况下，在组件初始化后更改客户数据时，您的模型不会更改。

data: {
  return {
    show: !this.options.customerdata.showbutton
  } 
}

如果您需要将值存储回选项（或将值绑定到客户数据），您还可以使用计算属性和 setter/getter

computed {
  show: {
    get () {
      !this.options.customerdata.showbutton
    }

    set (value) {
      this.options.customerdata.showbutton = !value
    }
  }
}

对于这两种情况，您都将其绑定

v-model="show"

Vuejs：如何在 V 模型中不是布尔值？

Vuejs : How to not a boolean value in V-model?

vue.js

v-model