时间戳

首页 > 解决方案 > 如何在 vue.js 中不使用禁用的情况下制作始终未选中的复选框？

forms - 如何在 vue.js 中不使用禁用的情况下制作始终未选中的复选框？

问题描述

我需要始终取消选中该复选框。我尝试通过将选中的属性绑定到数据中的 false 属性并将 @input/change 侦听器设置为不执行任何操作并使用 v-model 但它们都没有按预期工作。

代码在这里

标签： formsvue.jscheckbox

解决方案

https://jsfiddle.net/uv2hntba/

处理点击事件 (e) 并调用 e.preventDefault()

或使用@click.prevent 快捷方式

js：

new Vue({
  el: '#app',
  data: {
  },
  methods: {
    preventThisClickEvent(e) {
      e.preventDefault()
    }
  }
})

html

<script src="https://unpkg.com/vue"></script>

<div id="app">
  <input type="checkbox" :checked="checked" @click="preventThisClickEvent" /> prevent by method
  <br/>
  <input type="checkbox" :checked="checked" @click.prevent="doNothing" /> prevent by shortcut
</div>

推荐阅读