Menu Close

How to disable input conditionally with Vue.js?

How to disable input conditionally with Vue.js?

In this article, we’ll look at how to disable input conditionally with Vue.js.

To disable input conditionally with Vue.js, we set the disabled prop.

For instance, we write

<template>
  <button class="btn btn-default" :disabled="clickable">Click me</button>
</template>

<script>
export default {
  computed: {
    clickable() {
      return true;
    },
  },
};
</script> 

to define the clickable computed property in the component code.

Then we set the disabled prop to the clickable computed property to disable it if it’s true.

Posted in Vue.js

You can also read...