How to disable a button in Vue.js?

Sometimes, we want to disable a button in Vue.js.

In this article, we’ll look at how to disable a button in Vue.js.

How to disable a button in Vue.js?

To disable a button in Vue.js, we set the disabled prop of the button.

For instance, we write

<template>
  <div>
    <button :disabled="isDisabled">Send Form</button>
  </div>
</template>

to set the disabled prop to the isDisabled reactive property.

Therefore, the disabled attribute will be added to the button only if isDisabled is true.

Conclusion

To disable a button in Vue.js, we set the disabled prop of the button.