Enable/Disable button with Vue

Enable and Disable button when accept terms with checkbox

by willywg

HTML

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<div id="app">
  <p>
    <label for='terms'>
      <input id='terms' type='checkbox' v-model='terms' /> I accept terms!!!
    </label>
  </p>
  <button :disabled='isDisabled'>Send Form</button>
</div>

JavaScript

new Vue({
  el: '#app',
  data: {
  	terms: false
  },
  computed: {
  	isDisabled: function(){
    	return !this.terms;
    }
  }
})