如何禁用vuejs中的按钮

Question

我想在填写所有输入时禁用按钮

我试图通过简单地在

<button type="submit" class="btn btn-info" disabled>Next</button>

但我不知道如何在 vuejs 中做到这一点

Answer 1

只需将disabled属性绑定到一个布尔值，如

<button :disabled='isDisabled'>Send Form</button>

在这个例子中

Answer 2

您可以使用计算属性来启用/禁用按钮。每次计算属性内的条件发生变化时，将呈现按钮禁用或启用。条件应该是一个布尔值。

<template>
  ...
  <button type="submit" class="btn btn-info" :disabled="isDisabled">Next</button>
  ...
</template>

<script>
  export default {
    computed: {
      isDisabled() {
        // you can  check your form is filled or not here.
        return yourCondition == true
      },
    },
  }
</script>