Locking Elements in Vue

You can reactively block form elements using the disabled attribute. Let's try it. Let's make a corresponding property:

javascriptdata() {
  return {
    isDisabled: true,
  }
}

Let's bind this property to the button:

App.vue<template>
  <button v-bind:disabled="isDisabled">btn</button>
</template>

Задание 1

Given an input. Make a button that, when pressed, will alternately block and unblock our input.

Задание 2

Modify the previous task so that the state of the input is controlled by a checkbox: if the checkbox is checked, the input is disabled, and if it is not checked, the input is disabled.