If input is CHECKED button ENABLE VUE JS

I am trying to make enable the next button only when the box is checked. For this im trying to validate if the button is checked or not. Then once is checked and the button is enabled when going next to the next step. the button should be again disabled. I am imorting the Detailsform0.vue inside of ProductPage.vue through the date items:[] so each form as a separte file. Can someone help me with how to enable the button on click to checkbox and then on click next the button has to require again the same condition. Thank you in advance This is a screenshot of how it looks DetailsForm0.vue this is a test I have filled all this page

\\\\\ ProductPage.vue 
<template>
    <component v-bind:is="currentStep.details"></component>
    <button class="btn" v-on:click="backStep" id="back">Back</button>
    <button class="btn" v-on:click="nextStep" v-bind:disabled="checked === false" id="next">Next</button>
</template> /// DetailsForm0 <template>
    <component v-bind:is="currentStep.details"></component>
    <button class="btn" v-on:click="backStep" id="back">Back</button>
    <button class="btn" v-on:click="nextStep" v-bind:disabled="checked === false" id="next">Next</button></template>

  data: function () {
    return {
      items: [
        { stepTitle: 'Step 1', details: DetailsForm0 },
        { stepTitle: 'Step 2', details: DetailsForm1 },
        { stepTitle: 'Step 3', details: DetailsForm2 },
        { stepTitle: 'Step 4', details: DetailsForm3 }
      ],
      activeNumber: 0,
      checked:false
    }
  },